Page 102 - JqueryMobile_Manual
P. 102

102

                                                    Pre-select an option
                                              tryjqmob_forms_select_selected.html
               <!DOCTYPE html>
               <html>
               <head>
               <meta name="viewport" content="width=device-width, initial-scale=1">
               <link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
               <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
               <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
               </head>
               <body>

               <div data-role="page">
                 <div data-role="header">
                 <h1>Select Menus</h1>
                 </div>

                 <div data-role="main" class="ui-content">
                   <form method="post" action="/action_page_post.php">
                     <fieldset class="ui-field-contain">
                       <label for="day">Select Day</label>
                       <select name="day" id="day">
                         <option value="mon">Monday</option>
                         <option value="tue">Tuesday</option>
                         <option value="wed" selected>Wednesday</option>
                         <option value="thu">Thursday</option>
                         <option value="fri">Friday</option>
                         <option value="sat">Saturday</option>
                         <option value="sun">Sunday</option>
                       </select>
                     </fieldset>
                     <input type="submit" data-inline="true" value="Submit">
                   </form>
                 </div>
               </div>

               </body>
               </html>

                                                      Popup selections
                                               tryjqmob_forms_select_popup.html
               <!DOCTYPE html>
               <html>
               <head>
               <meta name="viewport" content="width=device-width, initial-scale=1">
               <link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
               <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
               <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
               </head>
               <body>

               <div data-role="page">
                 <div data-role="header">
                   <h1>Welcome To My Homepage</h1>
                 </div>
   97   98   99   100   101   102   103   104   105   106   107