Come posso precompilare una casella di testo jQuery Datepicker con la data odierna?

Ho un calendario jQuery Datepicker molto semplice:

$(document).ready(function(){
    $("#date_pretty").datepicker({ 
    });
});

e ovviamente in HTML ...

<input type="text" size="10" value="" id="date_pretty"/>

La data odierna è ben evidenziata per l'utente quando visualizzano il calendario, ma come faccio a ottenere jQuery per precompilare la casella di testo stessa con la data odierna sul caricamento della pagina, senza che l'utente faccia nulla? Il 99% delle volte, la data di default di oggi sarà quella che vogliono.

Aggiornamento: ci sono rapporti che non funzionano più in Chrome.

Questo è conciso e fa il lavoro (obsoleto):

$(".date-pick").datepicker('setDate', new Date());

Questo è meno conciso, l'utilizzo del concatenamento gli consente di lavorare in Chrome (04-06-2019):

$(".date-pick").datepicker().datepicker('setDate', new Date());

È necessario PRIMA chiamata datepicker ()> quindi utilizzare 'setDate' per ottenere la data corrente.

$(".date-pick").datepicker();
$(".date-pick").datepicker("setDate", new Date());

O concatenare la chiamata del metodo setDate dopo l'inizializzazione di datepicker, come indicato in un commento su questa risposta

$('.date-pick').datepicker({ /* optional option parameters... */ })
               .datepicker("setDate", new Date());

Sarà NON funzionerà con un solo

$(".date-pick").datepicker("setDate", new Date());

NOTA : i parametri accettabili setDate sono descritti qui

var myDate = new Date();
var prettyDate =(myDate.getMonth()+1) + '/' + myDate.getDate() + '/' +
        myDate.getFullYear();
$("#date_pretty").val(prettyDate);

sembrava funzionare, ma potrebbe esserci un modo migliore là fuori ..

Il setDate()metodo imposta la data e aggiorna il controllo associato. Ecco come:

$("#datepicker1").datepicker({
    dateFormat: "yy-mm-dd"
}).datepicker("setDate", "0");

dimostrazione

Come menzionato nella documentazione, setDate()accetta felicemente l'oggetto, il numero o una stringa JavaScript Date:

La nuova data può essere un oggetto Date o una stringa nel formato data corrente (ad es. '01 / 26/2009 '), un numero di giorni a partire da oggi (ad es. +7) o una stringa di valori e punti (' y 'per anni, 'm' per mesi, 'w' per settimane, 'd' per giorni, ad esempio '+ 1m + 7d') o null per cancellare la data selezionata.

Nel caso ti stia chiedendo, l'impostazione della defaultDateproprietà nel costruttore non aggiorna il controllo associato.

Impostato su oggi :

$('#date_pretty').datepicker('setDate', '+0');

Impostato su ieri :

$('#date_pretty').datepicker('setDate', '-1');

E così via con qualsiasi numero di giorni prima o dopo la data di oggi .

Vedi l' interfaccia utente di jQuery ›Metodi› setDate .

La soluzione è:

$(document).ready(function(){
    $("#date_pretty").datepicker({ 
    });
    var myDate = new Date();
    var month = myDate.getMonth() + 1;
    var prettyDate = month + '/' + myDate.getDate() + '/' + myDate.getFullYear();
    $("#date_pretty").val(prettyDate);
});

Grazie grayghost!

Questo ha funzionato per me.

$('#inputName')
  .datepicker()
  .datepicker('setDate', new Date());

Questo codice assicurerà di utilizzare il formato del tuo datepicker:

$('#date-selector').datepicker('setDate', new Date());

Non è necessario riapplicare il formato, utilizza il datepicker predefinito-uno da te all'inizializzazione di datepicker (se lo hai assegnato!);)

Il codice di David K ​​Egghead ha funzionato perfettamente, grazie!

$(".date-pick").datepicker(); 
$(".date-pick").datepicker("setDate", new Date()); 

Sono anche riuscito a tagliarlo un po 'e ha anche funzionato:

$(".date-pick").datepicker().datepicker("setDate", new Date()); 

$('input[name*="date"]').datepicker({
        dateFormat: 'dd-mm-yy',
        changeMonth: true,
        changeYear: true,
        beforeShow: function(input, instance) { 
            $(input).datepicker('setDate', new Date());
        }
    });

Per impostare il datepicker su una determinata ora predefinita (la data corrente nel mio caso) al caricamento, E quindi avere la possibilità di scegliere un'altra data la sintassi è:

    $(function() { 
        // initialize the datapicker
        $("#date").datepicker();

        // set the time
        var currentDate = new Date();
        $("#date").datepicker("setDate",currentDate);

    //  set the options for the button  
        $("#date").datepicker("option",{
            dateFormat: 'dd/mm',
            showOn: "button",
          // whatever option Or event you want 
        });
  });

Per precompilare la data, devi prima inizializzare datepicker, quindi passare il valore del parametro setDate.

$("#date_pretty").datepicker().datepicker("setDate", new Date());

Ho pensato di aggiungere i miei due centesimi. Il selettore viene utilizzato in un modulo di aggiunta / aggiornamento, quindi è necessario mostrare la data proveniente dal database se si modifica un record esistente o mostrare la data odierna in caso contrario. Di seguito funziona bene per me:

    $( "#datepicker" ).datepicker();
    <?php if (!empty($oneEVENT['start_ts'])): ?>
       $( "#datepicker" ).datepicker( "setDate", "<?php echo $startDATE; ?>" );
    <? else: ?>
       $("#datepicker").datepicker('setDate', new Date());   
    <?php endif; ?>
  });

Hai 2 opzioni:

OPZIONE A) Contrassegna come "attivo" nel tuo calendario, solo quando fai clic sull'input.

Js :

$('input.datepicker').datepicker(
                        {   
                            changeMonth: false,
                            changeYear: false,
                            beforeShow: function(input, instance) { 
                                $(input).datepicker('setDate', new Date());
                            }
                        }                         
                     );

Css :

div.ui-datepicker table.ui-datepicker-calendar .ui-state-active,
        div.ui-datepicker table.ui-datepicker-calendar .ui-widget-content .ui-state-active  {
            background: #1ABC9C;
            border-radius: 50%;
            color: #fff;
            cursor: pointer;
            display: inline-block;
            width: 24px; height: 24px;
        }​

OPZIONE B) Inserimento di default con oggi. Devi prima compilare il datepicker.

$ ("input.datepicker"). datepicker (). datepicker ("setDate", nuova data ());

var prettyDate = $.datepicker.formatDate('dd-M-yy', new Date());
alert(prettyDate);

Assegna prettyDate al controllo necessario.

Prova questo

$(this).datepicker("destroy").datepicker({
            changeMonth: false, changeYear: false,defaultDate:new Date(), dateFormat: "dd-mm-yy",  showOn: "focus", yearRange: "-5:+10"
        }).focus();

Questo funziona meglio per me poiché a volte ho problemi a chiamare .datepicker('setDate', new Date());in quanto incasina se ho lo datepicker già configurato con i parametri.

$("#myDateText").val(moment(new Date()).format('DD/MM/YYYY'));

Usa questo:

$(".datepicker").datepicker({ dateFormat: 'dd-M-yy' }).datepicker('setDate', new Date());

Per ottenere la data in formato Ad esempio: 10-ott-2019, che sarà più comprensibile per gli utenti.

$(function()
{
$('.date-pick').datePicker().val(new Date().asString()).trigger('change');
});

Fonte: http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerDefaultToday.html