Jak wstępnie wypełnić pole tekstowe jQuery Datepicker dzisiejszą datą?

Mam bardzo prosty kalendarz jQuery Datepicker:

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

i oczywiście w HTML ...

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

Dzisiejsza data jest ładnie podświetlona dla użytkownika, gdy wywołuje on kalendarz, ale jak mogę uzyskać jQuery, aby wstępnie wypełniało samo pole tekstowe dzisiejszą datą przy ładowaniu strony, bez wykonywania przez użytkownika żadnych działań? 99% czasu, dzisiejsza domyślna data będzie tym, czego chcą.

Aktualizacja: istnieją raporty, które nie działają już w Chrome.

Jest to zwięzłe i działa (przestarzałe):

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

Jest to mniej zwięzłe, użycie łańcuchów pozwala mu pracować w chromie (2019-06-04):

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

Musisz najpierw wywołać datepicker ()>, a następnie użyć „setDate”, aby uzyskać bieżącą datę.

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

LUB połącz swoje wywołanie metody setDate po inicjalizacji datepicker, jak zauważono w komentarzu do tej odpowiedzi

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

To będzie NIE działać z just

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

UWAGA : Akceptowane parametry setDate opisano tutaj

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

wydawało się, że działa, ale może istnieć lepsze wyjście.

setDate()Metoda ustawia datę i aktualizuje powiązany kontroli. Oto jak:

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

Próbny

Jak wspomniano w dokumentacji, z setDate()przyjemnością akceptuje obiekt, numer lub ciąg JavaScript Date:

Nowa data może być obiektem Date lub ciągiem w bieżącym formacie daty (np. „01/26/2009”), liczbą dni od dzisiaj (np. +7) lub ciągiem wartości i okresów („y” dla lata, „m” dla miesięcy, „w” dla tygodni, „d” dla dni, np. „+ 1m + 7d”) lub zero, aby wyczyścić wybraną datę.

Jeśli się zastanawiasz, ustawienie defaultDatewłaściwości w konstruktorze nie aktualizuje powiązanej kontrolki.

Ustaw na dziś :

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

Ustaw na wczoraj :

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

I tak dalej z dowolną liczbą dni przed lub po dzisiejszej dacie .

Zobacz interfejs użytkownika jQuery ›Metody› setDate .

Rozwiązaniem jest:

$(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);
});

Dzięki grayghost!

Ten kod zapewni użycie formatu narzędzia datepicker:

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

Nie ma potrzeby ponownego stosowania formatu, używa on predefiniowanego datepicker-jeden podczas inicjowania datepicker (jeśli go przypisałeś!);)

Ten działał dla mnie.

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

Kod Davida K Egghead działał idealnie, dziękuję!

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

Udało mi się też trochę przyciąć i zadziałało:

$(".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());
        }
    });

Aby ustawić datepicker na określony domyślny czas (bieżąca data w moim przypadku) przy ładowaniu, ORAZ wtedy możesz wybrać inną datę, składnia jest następująca:

    $(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 
        });
  });

Aby wstępnie wypełnić datę, najpierw należy zainicjować datepicker, a następnie przekazać wartość parametru setDate.

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

Pomyślałem, że dodam dwa centy. Selektor jest używany w formularzu dodawania / aktualizacji, więc musiał edytować datę pochodzącą z bazy danych, jeśli edytujesz istniejący rekord, lub pokazywać dzisiejszą datę, jeśli nie. Poniżej działa dobrze dla mnie:

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

Masz 2 opcje:

OPCJA A) Zaznacza jako „aktywne” w kalendarzu, tylko po kliknięciu wejścia.

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;
        }​

OPCJA B) Wprowadź domyślnie z dzisiaj. Musisz wypełnić najpierw datepicker.

$ („input.datepicker”). datepicker (). datepicker („setDate”, nowa data ());

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

Przypisz prettyDate do niezbędnej kontroli.

Spróbuj tego

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

Działa to dla mnie lepiej, ponieważ czasami mam problemy z dzwonieniem, .datepicker('setDate', new Date());ponieważ zadziera, jeśli mam ustawiony wcześniej parametr z datownikiem.

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

Użyj tego:

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

Aby uzyskać datę w formacie Np .: 10-paź-2019, która będzie bardziej zrozumiała dla użytkowników.

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

Źródło: http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerDefaultToday.html