pane Object

The pane configuration options.

pane.initial String

The id of the initial mobile View to display.

    <div data-role="view">
      Open PopOver


      <div id="foo" data-role="popover" data-pane='{ "initial": "#view2" }'>
        <div data-role="view" id="view1" data-title="view1">
          View 1
        </div>
        <div data-role="view" id="view2" data-title="view2">
          View 2
        </div>
      </div>
    </div>

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

pane.layout String

The id of the default Pane Layout.

    <div data-role="view">
      Open PopOver


      <div id="foo" data-role="popover" data-pane='{ "layout": "popoverLayout" }'>
        <div data-role="view" id="view1" data-title="view1">
          View 1
        </div>
        <div data-role="view" id="view2" data-title="view2">
          View 2
        </div>

        <div data-role="layout" data-id="popoverLayout">
          <header data-role="header">
            <div data-role="navbar">
              <span data-role="view-title"></span>
            </div>
          </header>
          <div data-role="footer">
            <div data-role="tabstrip">
              <a href="#view1">view1</a>
              <a href="#view2">view2</a>
            </div>
          </div>
        </div>
      </div>
    </div>

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

pane.loading String(default: "Loading...")

The text displayed in the loading popup. Setting this value to false will disable the loading popup.

    <div data-role="view">
      Open PopOver


      <div id="foo" data-role="popover" data-pane='{ "loading": "sample text" }'>
        <div data-role="view" data-show="showLoading">
          View 1
        </div>
      </div>
    </div>

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

    function showLoading(e) {
      var pane = $("#foo").data("kendoMobilePopOver").pane;
      pane.showLoading();

      setTimeout(function() {
        pane.hideLoading();
      }, 3000);
    }
    </script>

pane.transition String

The default View transition.

    <div data-role="view">
      Open PopOver


      <div id="foo" data-role="popover" data-pane='{ "transition": "slide" }'>
        <div data-role="view" id="view1">
          View 1
        </div>
        <div data-role="view" id="view2">
          View 2
        </div>
      </div>
    </div>

    <script>
    var app = new kendo.mobile.Application();
    </script>
In this article