KendoUI tabstrip导航到空白页面

时间:2013-05-10 12:48:11

标签: kendo-ui kendo-mobile

我正在使用我从KendoUI页面获取的自定义标签,并根据我的应用进行了调整。\

它有3个标签(home,startOfDay和stop)。每个标签都会转到HTML页面。

问题在于,我可以从Home导航到其他选项卡之一而没有问题,但之后如果我尝试导航到另一个选项卡,它只会转到空白页。

这是我的布局代码。

<section data-role="layout" data-id="default">
    <header data-role="header">
        <div data-role="navbar">FnF Driver Application</div>
    </header>
    <!--View content will render here-->
    <footer data-role="footer">
        <div data-role="tabstrip" id="custom-tabstrip">
            <a data-icon="home" href="home.html">Home</a>
            <a data-icon="globe" href="startOfDay.html">Start Of Day</a>
            <a data-icon="toprated" href="stops.html">Stops</a>
        </div>
    </footer>
</section>

每个页面都包含在一个看起来像这样的div中......

<body>
    <div id="home/startOfDay/stops" data-role="view" data-layout="default">
     ~Content goes here~
    </div>
</body>

非常感谢任何帮助。

感谢!!!

2 个答案:

答案 0 :(得分:0)

尝试从您的观看中删除<body>代码?我认为当Kendo UI Mobile在远程视图中读取它时会将其注入到页面DOM中,并且使用另一个<body>标记可能会弄乱它。

答案 1 :(得分:0)

我在某处读到布局必须至少定义一个视图才能正常工作,即使它是一个空白视图。尝试放入一个空白视图。

<section data-role="layout" data-id="default">
    <header data-role="header">
        <div data-role="navbar">FnF Driver Application</div>
    </header>
    <!--View content will render here-->
    <div data-role="view"></div>
    <footer data-role="footer">
        <div data-role="tabstrip" id="custom-tabstrip">
            <a data-icon="home" href="home.html">Home</a>
            <a data-icon="globe" href="startOfDay.html">Start Of Day</a>
            <a data-icon="toprated" href="stops.html">Stops</a>
        </div>
    </footer>
</section>