Bootstrap data gamma picker salienti mobili data precedente quando si modificano data

Question

io uso bootstrap date range picker con 2 calendari così la gente può scegliere start e end date. Qualcosa di nuovo che ho fatto è, una volta che un utente seleziona la data di inizio, mi concentro sulla data di fine, quindi il calendario si apre automaticamente.

FIDDLE?

Ho provato a impostare un violino, ma non funziona su un violino, ma puoi sempre eseguire il test sul sito Web del plug-in, proprio come succede sul plug-in originale. Vedi date range picker website qui.

IL PROBLEMA

Su iPhone, quando seleziono la data di inizio del calendario enddate si apre automaticamente, che è grande. Ma il problema è che si blocca su un hover in cui avevo il dito. Quindi, se guardi lo screenshot, ho selezionato 8th nel calendario START e quando si concentra sul calendario FINE, si aggira anche su 6th automaticamente perché avevo il dito sulla stessa area quando ho selezionato 8th.

Come può essere risolto? Ho provato tutti i plugin e le soluzioni di risoluzione ios hover issue, ma niente sembra risolvere questo problema.

Answer 1

si può distruggere e reinizializzare end-date Data-picker quando si visualizza dopo all'utente di selezionare data di inizio?

Rende il sito Web lento quando si seleziona data. Non ho I-phone, quindi non posso replicare quindi è solo una supposizione.

Answer 2

Vorrei impostare autoclose: true, in modo che Datepicker si chiuda automaticamente quando viene selezionata una data. Quindi, è possibile utilizzare hide evento per sapere quando mostrare 'fine' Datepicker, ma qui si imposta una piccola timeout come 100-200ms

$('#datepicker-start').datepicker({ 
    autoclose: true 
}).on('hide', function(e) { 
    window.setTimeout(function(){ 
     $('#datepicker-end').datepicker('show'); 
    }, 100) 
}); 
$('#datepicker-end').datepicker(); 

check Fiddle