Simple TabStrip markup not working. Am I going nuts?

2 posts, 0 answers
  1. CM
    CM avatar
    12 posts
    Member since:
    Nov 2012

    Posted 07 Nov 2012 Link to this post

    Hi all,

    I am excited about the prospect of using KendoUI and am in my trial, but I can't even make a simple tabstrip UI page work correctly. I was following along with the intro tutorial here:

    Couldn't get that to work. CSS works and the widgets are there, but when I click on the About tab the about.html is appended to the URL, but I don't actually go to the about.html page. 

    I decided to rip open the sample apps and take a look. I changed my index.html around to try to load a different view when clicking on the about tabstrip:

    <!DOCTYPE html>
        <title>My App</title>
        <link href="css/" rel="stylesheet" />
        <div data-role="view" data-layout="default">
            Hello Mobile World!
        <div data-role="view" id="about" data-title="About">
            About this app.
        <div data-role="layout" data-id="default">
            <header data-role="header">
                <div data-role="navbar">My App</div>
            <!-- View content will render here -->
            <footer data-role="footer">
                <div data-role="tabstrip">
                    <a href="#">Home</a>
                    <a href="#about">About</a>
        <script src="js/jquery.min.js" type="text/javascript"></script>
        <script src="js/" type="text/javascript"></script>
            var app = new;

    I get the about view to load, but not "inside" of the layout, the screen is white, no title bar and just has the about text.

    So, am I going mad? Any ideas are welcome. Thanks!
  2. Daniel
    Daniel avatar
    2110 posts

    Posted 12 Nov 2012 Link to this post

    Hello Christopher,

    The data-layout option should be specified to the "about" view in order for the layout to be used e.g.

    <div data-role="view" data-layout="default" id="about" data-title="About">
        About this app.
    Kind regards,
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top