sample code doesn't show the check boxes and radio buttons. only thing i changed was the heading path

2 posts, 0 answers
  1. Rozen
    Rozen avatar
    13 posts
    Member since:
    Aug 2013

    Posted 01 Sep 2013 Link to this post

    <!DOCTYPE html>
    <html>
    <head>
            <title></title>
            <meta charset="utf-8" />
            <link href="kendo/styles/kendo.mobile.all.min.css" rel="stylesheet" />
            <link href="styles/main.css" rel="stylesheet" />

            <script src="cordova.js"></script>
            <script src="kendo/js/jquery.min.js"></script>
            <script src="kendo/js/kendo.mobile.min.js"></script>
            <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor;=true"></script>
            
            

        </head>
    <body>
        <div id="checks" data-role="view" data-title="Shopping List" data-layout="checklayout">
        <ul data-role="listview" data-style="inset">
            <li>
                <label>
                    <input type="checkbox" checked="checked" />
                    Lettuce
                </label>
            </li>
            <li>
                <label>
                    <input type="checkbox" />
                    Carrots
                </label>
            </li>
            <li>
                <label>
                    <input type="checkbox" />
                    Peas
                </label>
            </li>
            <li>
                <label>
                    <input type="checkbox" />
                    Bread
                </label>
            </li>
            <li>
                <label>
                    <input type="checkbox" />
                    Unicorns
                </label>
            </li>
        </ul>
    </div>

    <div id="radios" data-role="view" data-title="Settings" data-layout="checklayout">
        <ul data-role="listview" data-style="inset" data-type="group">
            <li>
                On Item Check
                <ul>
                    <li>
                        <label>
                            <input name="radio" type="radio" checked="checked" />
                            Move to bottom
                        </label>
                    </li>
                    <li>
                        <label>
                            <input name="radio" type="radio" />
                            Delete
                        </label>
                    </li>
                    <li>
                        <label>
                            <input name="radio" type="radio" />
                            Leave in place
                        </label>
                    </li>
                </ul>
            </li>
        </ul>
        <ul data-role="listview" data-style="inset" data-type="group">
            <li>
                Show Units
                <ul>
                    <li>
                        <label>
                            <input name="units" type="radio" checked="checked" />
                            In Kilograms
                        </label>
                    </li>
                    <li>
                        <label>
                            <input name="units" type="radio" />
                            In Grams
                        </label>
                    </li>
                    <li>
                        <label>
                            <input name="units" type="radio" />
                            In Pieces
                        </label>
                    </li>
                </ul>
            </li>
        </ul>
    </div>

    <div data-role="layout" data-id="checklayout">
        <header data-role="header">
            <div data-role="navbar">
                <span data-role="view-title"></span>
                <a data-align="right" data-role="button" class="nav-button" href="#index">Index</a>
            </div>
        </header>

        <div data-role="footer">
            <div data-role="tabstrip">
                <a href="#checks" data-icon="bookmarks">Shopping
                </a><a href="#radios" data-icon="settings">Settings</a>
            </div>
        </div>
    </div>



    <script>
        var app = new kendo.mobile.Application(document.body);
    </script>
    </body>
    </html>
  2. Steve
    Admin
    Steve avatar
    10941 posts

    Posted 03 Sep 2013 Link to this post

    Hello Rozen,

    This markup seems to work in the Simulator (see http://screencast.com/t/16rKVWzF6). Are you having trouble when deployed on a read device and if yes, what is the device and OS? Please make sure you're using latest available version of Kendo UI as well.

    Regards,
    Steve
    Telerik

    Looking for tips & tricks directly from the Icenium team? Check out our blog!
    Share feedback and vote for features on our Feedback Portal.
Back to Top