Problem with Kendo Mobile Application, initial and html select.

4 posts, 1 answers
  1. Gabriel
    Gabriel avatar
    3 posts
    Member since:
    Aug 2012

    Posted 02 Aug 2012 Link to this post

    Hi!

    I have been spending the last few hours on this problem. I am trying to present a view that contains a html select element and uses a layout element. My code is as follows:

      <head>
      <title>Branch</title>
       <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
    <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge" >
        <script src="./js/jquery.min.js"></script>
        <script src="./js/jquery.mobile-1.1.1.min.js"></script>
        <script src="./js/kendo.mobile.min.js"></script>


        <link href="./styles/kendo.common.min.css" rel="stylesheet" />
        <link href="./styles/kendo.mobile.all.min.css" rel="stylesheet" />
        
        </head>
      <body>
           <div data-role="view" id="myBookings" data-id="myBookings" data-layout="overview" data-title="My Bookings">
              Current Branch: <select id="branch-select">
              </select>
              


          </div>
          
          <div data-role="layout" data-id="overview">
              <header data-role="header">
                  <div data-role="navbar">
                      <span data-role="view-title"></span>
                  </div>
              </header>
          </div>
          <script>
              var app = new kendo.mobile.Application($(document.body)/*, {initial:"myBookings"}*/);
          </script>
          
      </body>

    This almost works. However, if I inspect the webpage, the <div> element of the view is in the website three times. For ios users, this means that they can navigate through all three select elements using the "previous"/"next" buttons when the select is expanded.

    I already tried uncommenting the commented line with the initial setting. However, this does not work at all. According to the console, the browser appears to try to load a file named "myBookings".

    How do i get this to work so that the ios devices treat the select as one?
  2. Answer
    Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 03 Aug 2012 Link to this post

    Hello,

    I did not manage to reproduce the problem with the view appearing three times in the final markup (see screenshot). 

    Perhaps the jQuery mobile reference you have added causes this? In general, using the same libraries simultaneously is not supported. 

    Greetings,
    Petyo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 03 Aug 2012 Link to this post

    Forgot the screenshot, please see attachment.

    Kind regards,
    Petyo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. Gabriel
    Gabriel avatar
    3 posts
    Member since:
    Aug 2012

    Posted 03 Aug 2012 Link to this post

    Thanks a lot!

    the jQuery mobile reference really was the problem.

    Regards,
    Gabriel
Back to Top
Kendo UI is VS 2017 Ready