title: How to prevent showing Jquery UI datepicker/timepicker on mobile
body: <p>I am in trouble getting inputs types date and time to work on mobiles. I am getting double picking tools on mobiles (the native one and the JQuery UI) one and it won't let me complete the form, because datepicker won't hide. How can I prevent the JQuery UI picker to be displayed on mobiles that has native picking tool?
  <a href="https://i.stack.imgur.com/FDuUl.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/FDuUl.png" alt="example"></a></p>
  
  <p>This is the sample code I have:</p>
  
  <pre><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="css\jquery-ui.min.css"&gt;
  &lt;script src="js\jquery-ui.min.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-timepicker-addon/1.6.3/jquery-ui-timepicker-addon.min.css" /&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-timepicker-addon/1.6.3/jquery-ui-timepicker-addon.min.js"&gt;&lt;/script&gt;
  
  &lt;form class="form-horizontal" method="post" action="seleccionar_detalles.php"&gt;
      &lt;div&gt;
          &lt;input type="date" id="lala" classs="fecha1" name="lala"&gt;
          &lt;input type="time" placeholder="Salida" id="salida" name="Fecha_de_salida[]" /&gt;
  
      &lt;/div&gt;
      &lt;div class="form-group col-xs-24"&gt;
          &lt;div class="col-xs-6 pull-right"&gt;
              &lt;button type="submit" class="btn btn-siguiente"&gt;Submit&lt;/button&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/form&gt;
  
  &lt;script&gt;
      $('#salida').timepicker();
      $( ".fecha1" ).datepicker();
  &lt;/script&gt;
  </code></pre>