This is a migrated thread and some comments may be shown as answers.

Problem with Kendo Mobile Application, initial and html select.

3 Answers 88 Views
Application
This is a migrated thread and some comments may be shown as answers.
Gabriel
Top achievements
Rank 1
Gabriel asked on 02 Aug 2012, 04:55 PM
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?

3 Answers, 1 is accepted

Sort by
0
Accepted
Petyo
Telerik team
answered on 03 Aug 2012, 07:16 AM
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!
0
Petyo
Telerik team
answered on 03 Aug 2012, 07:17 AM
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!
0
Gabriel
Top achievements
Rank 1
answered on 03 Aug 2012, 09:55 AM
Thanks a lot!

the jQuery mobile reference really was the problem.

Regards,
Gabriel
Tags
Application
Asked by
Gabriel
Top achievements
Rank 1
Answers by
Petyo
Telerik team
Gabriel
Top achievements
Rank 1
Share this question
or