Bootstrap Datepicker - selezionando data da inline/embedded versione

Question

Qualcuno può spiegare come catturare la data selezionata dalla versione in linea/embedded di esteso Bootstrape Datepicker di Eternicode - http://eternicode.github.io/bootstrap-datepicker/

<form class="form-date" role="form" action="/'.$ref.'/edit" method="get"> 
    <div class="form-group" id="datepickid"> 
     <div></div> 
     <input type="hidden" name="dt_due" id="dt_due"> 
    </div> 
    <button type="submit" class="btn btn-default">Submit</button> 
</form> 

... 

$('#datepickid div').datepicker({ 
    startDate: "+1d", 
    todayHighlight: true 
}); 

Come sono sicuro che è chiaro, Voglio che scriva sull'input nascosto quando cambia la data selezionata.

Sono sicuro che mi manca qualcosa di ovvio, ma gli altri esempi scrivono sull'input anche questo è collegato, ma non sembra esserci alcun modo ovvio in cui i dati vengono emessi dalla versione inline.

Tutti apprezzati.

Answer 1

Non importa, la risposta è stata data tramite un gruppo di Google.

ho dovuto aggiungere .on (CHANGEDATE) ...

$('#datepickid div').datepicker({ 
    startDate: "+1d", 
    todayHighlight: true 
    }).on('changeDate', function(e){ 
     $('#dt_due').val(e.format('dd/mm/yyyy')) 
    }); 

Answer 2

È inoltre possibile utilizzare questo per ottenere tutte le date (per multidate)

$('#datepickid div').datepicker({ 
    startDate: "+1d", 
    todayHighlight: true 
}).on('changeDate', function(e){ 
    $('#dt_due').val(
    $('#datepickid div').datepicker('getFormattedDate') // get the formatted date from the datepicker (using the format you instantiated it with) 
); 
}); 

Answer 3

Recentemente sto lavorando in un progetto che ha bisogno di implementare alcune pagine usando datepicker per una maggiore usabilità degli utenti, più specifico Bootstrap 3 DatePicker, in particolare penso che sia il miglior framework che abbia mai trovato su internet. Mentre stavo sviluppando, ho trovato lo stesso problema che descrivi, ma come non so quale framework specifico stai usando, sto descrivendo la mia soluzione e il mio codice. Inizialmente, il framework in questione è lo Bootstrap 3 Datepicker. Questa risposta potrebbe non essere utile ad alcuni utenti che utilizzano altri framework, diversi da questo.

Il mio codice HTML:

<div class="form-group form-group-md" align="left"> 
    <label for="inputDataInicial" class="col-form-label">Data Inicial:</label> 
    <div class="inputDataInicial" name="inputDataInicial" id="inputDataInicial"></div> 
</div> 

per inizializzare la datepicker:

$("#inputDataInicial").datetimepicker({ 
format: 'DD/MM/YYYY', 
locale: 'pt-br', 
useCurrent: true, 
inline: true, 
sideBySide: true 
}).on('dp.change', function(e){ 
    $('.inputDataInicial').val(e.date.format('YYYYMMDD')); 
}); 

Successivamente, ho impostare la data predefinita utilizzando il quadro moment - Bootstrap 3 Datepicker lo utilizza:

var currentDate = moment().format('YYYYMMDD'); 
$('.inputDataInicial').val(currentDate); 
$('.inputDataFinal').val(currentDate); 

Infine, ho implementato un semplice pulsante per ottenere la data selezionata:

$(".btn_relatorio_amap_gerar").unbind("click").on("click",function(e) { 
    var data_inicial = $(".inputDataInicial").val() + ' 00:00:00'; 
    var data_final = $(".inputDataFinal").val() + ' 23:59:59'; 
    alert(data_inicial + ' - ' + data_final); 
}); 

Il risultato:

Spero che ti aiuta.