jQuery UI Datepicker - Perché il 2nd datepicker scompare onfocus?

Question

Ho due elementi input che funzionano come datepicker dell'interfaccia utente jQuery. Dopo aver effettuato una selezione sul primo elemento datepicker, dovrebbe concentrarsi automaticamente sul secondo elemento datepicker e mostrare il calendario, permettendoti di fare una scelta facile e veloce.

Per qualsiasi motivo, il secondo DatePicker/Calendario viene visualizzato per un momento e quindi scompare. Non sono sicuro del perché sta scomparendo; qualcuno può offrirmi una spiegazione del perché sta scomparendo e una possibile soluzione?

Attualmente utilizzando le seguenti librerie: jQuery 1.8.3, jQuery UI 1.9.2

Ecco il codice Attualmente sto usando:

<ul class="fields"> 
    <li><label>Date picker #1</label> 
     <input type="text" class="date-picker-1" /> 
    </li> 
    <li><label> Date picker #2</label> 
     <input type="text" class="date-picker-2" /> 
    </li> 
</ul> 

$('input.date-picker-1').datepicker({ 
    constrainInput: true, 
    hideIfNoPrevNext: true, 
    onSelect: function() { 
     $(this).closest('.fields') 
      .find('.date-picker-2').datepicker('show'); 
    } 
}); 

$('input.date-picker-2').datepicker({ 
    onFocus: 'show' 
}); 

Ecco un violino: http://jsfiddle.net/B78JJ/

Se uno qualsiasi altre informazioni sarebbero utili non esitate a chiedere e sarò felice di dare una mano.

Answer 1

Sembra un problema di temporizzazione messa a fuoco, la soluzione rapida è quella di utilizzare un piccolo timeout:

$('input.date-picker-1').datepicker({ 
    constrainInput: true, 
    hideIfNoPrevNext: true, 
    onSelect: function() { 
     var dees = $(this); 
     setTimeout(function() { 
      dees.closest('.fields').find('.date-picker-2').datepicker('show'); 
     }, 100); 
    } 
}); 

Vedi working fiddle

Answer 2

A CAUSA DI QUESTA

$(this).closest('.fields') 
      .find('.date-picker-2').datepicker('show'); 

è possibile utilizzare

window.setTimeout(function(){ 
      $('.date-picker-2').datepicker('show'); 
     }, 1);