Stuck in step #1

3 posts, 1 answers
  1. Answer
    Javier
    Javier avatar
    3 posts
    Member since:
    Jul 2013

    Posted 16 Aug 2013 Link to this post

    Hello all,

    I am trying to take step #1 using Kendo mobile and having a problem. I have set up a folder containing a copy of the "js" and "styles" folders from my downloaded Kendo Trial distribution and  created a test.html file with  the so called "first complete example" in http://docs.kendoui.com/getting-started/introduction  which has the following code:

    <!doctype html>
    <html>
        <head>
            <title>Kendo UI Mobile</title>
            <link href="styles/kendo.mobile.all.min.css" rel="stylesheet" />
            <script src="js/jquery.min.js"></script>
            <script src="js/kendo.mobile.min.js"></script>
        </head>
        <body>
            <div data-role="view" data-title="View" id="index">
                <header data-role="header">
                    <div data-role="navbar">
                        <span data-role="view-title"></span>
                    </div>
                </header>
                <ul data-role="listview">
                  <li>Item 1</li>
                  <li>Item 2</li>
                </ul>
                <footer data-role="footer">
                    <div data-role="tabstrip">
                        <a data-icon="home" href="#index">Home</a>
                        <a data-icon="settings" href="#settings">Settings</a>
                    </div>
                </footer>
            </div>
            <script>
            var app = new kendo.mobile.Application();
            </script>
        </body>
    </html>

    When I load it in my browser I get a blank screen, but as you can see in the first image I attach, the debugger shows that the included CSS and JS files are retrieved correctly, and as the second image shows, there seems to be an error.

    Out of curiosity, I have replaced the local file references with references to kendo's CDN, like this:
        <head>
            <title>Kendo UI Mobile</title>
            <link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.mobile.all.min.css" rel="stylesheet" />
            <script src="http://cdn.kendostatic.com/2012.2.710/js/jquery.min.js"></script>
            <script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.mobile.min.js"></script>
        </head>

    And it works as shown in my third suplied image.

    Any idea of what am I doing wrong ?

    Thanks in advance:

                                Javier


  2. Javier
    Javier avatar
    3 posts
    Member since:
    Jul 2013

    Posted 16 Aug 2013 Link to this post

    Sorry guys,

    My 17 year's old son had been "improving" the original files with some revolutionary ideas.  Just re-downloaded and everything is fine now. 

    Sorry again,
                            Javier
  3. Petyo
    Admin
    Petyo avatar
    2444 posts

    Posted 16 Aug 2013 Link to this post

    Hi Javier,

    The code sample you have used seems ok. The code posted seems to be working with the current CDN version too (your sample uses Q2 2012) - check this jsbin. My guess is that something may have gone wrong with the kendo.mobile.min.js file (partial download, for instance). Can you please try re-downloading the bundle? 

    Regards,
    Petyo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top