Navigate to local or to remote view.

Navigate to a remote view

<div data-role="view" id="foo"><a data-role="button" data-click="navigateToSettings">Bar</a></div>

<script>
    var app = new kendo.mobile.Application();

    function navigateToSettings() {
        app.navigate("settings.html"); // the url of the remote view
    }
</script>

Navigate to a local view

<div data-role="view" id="foo"><a data-role="button" data-click="navigateToSettings">Bar</a></div>
<div data-role="view" id="settings">Settings</div>

<script>
    var app = new kendo.mobile.Application();

    function navigateToSettings() {
        app.navigate("#settings"); // the id of the local view
    }
</script>

Navigate backwards to the previously visited mobile View

<div data-role="view" id="foo"><a data-role="button" href="#settings">Bar</a></div>
<div data-role="view" id="settings"><a data-role="button" data-click="goBack">Back</a></div>

<script>
    var app = new kendo.mobile.Application();

    function goBack() {
        app.navigate("#:back");
    }
</script>

Parameters

url String

The id or url of the view.

transition String

Optional. The transition to apply when navigating. See View Transitions section for more information.

Example
<div data-role="view" id="foo"><a data-role="button" data-click="navigateToSettings">Bar</a></div>
<div data-role="view" id="settings">Settings</div>

<script>
    var app = new kendo.mobile.Application();

    function navigateToSettings() {
        app.navigate("#settings", "slide");
    }
</script>
In this article