Page 89 - JqueryMobile_Manual
P. 89

89

                                             Adding an icon in input buttons
                                                 tryjqmob_forms_buttons2.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="main" class="ui-content">
                   <form method="post" action="/action_page_post.php">
                     <label for="fname">First name:</label>
                     <input type="text" name="fname" id="fname">
                     <input type="submit" value="Submit" data-icon="check" data-iconpos="right" data-inline="true">
                   </form>
                 </div>
               </div>

               </body>
               </html>

                                             Adding a "clear" button in inputs
                                                   tryjqmob_forms_clear.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="main" class="ui-content">
                   <form method="post" action="/action_page_post.php">
                     <p>Type something in the input field and a clear button will appear to the right:</p>
                     <label for="fname">First name</label>
                     <input type="text" name="fname" id="fname" data-clear-btn="true">
                   </form>
                 </div>
               </div>

               </body>
               </html>
   84   85   86   87   88   89   90   91   92   93   94