Jak uzyskać datę z jQuery UI datepicker

85

Chcę uzyskać datę z datepicker za każdym razem, gdy użytkownik wybierze datę w datepicker jQuery UI i kliknie przycisk na formularzu.

cóż, potrzebuję dnia, miesiąca i roku z wybranej przez nich daty. Jak mogę uzyskać datę z interfejsu użytkownika jQuery?

TJ
źródło

Odpowiedzi:

130

Posługiwać się

var jsDate = $('#your_datepicker_id').datepicker('getDate');
if (jsDate !== null) { // if any date selected in datepicker
    jsDate instanceof Date; // -> true
    jsDate.getDate();
    jsDate.getMonth();
    jsDate.getFullYear();
}
CoolEsh
źródło
Czy jest to sposób na uruchomienie dowolnej metody na typie danych Date? Mam na myśli getDate, getMonth, getFullYear itp.?
Ajeeb.KP
Po wywołaniu getDate na datepicker otrzymasz obiekt js Date (), którego można następnie użyć do wywołania getDate, getMonth, getFullYear itp.
CoolEsh
jeśli wypiszemy zmienną jsDate, to da nam coś takiego Mon Aug 24 2020 00:00:00 GMT + 0530 (India Standard Time). Teraz możemy zastosować metodę getDate, getMonth, getFullYear na jsDate.
Laveena
87

Możesz pobrać datę za pomocą funkcji getDate:

$("#datepicker").datepicker( 'getDate' );

Wartość jest zwracana jako obiekt Date JavaScript.

Jeśli chcesz użyć tej wartości, gdy użytkownik wybierze datę, możesz użyć zdarzenia onSelect:

$("#datepicker").datepicker({
   onSelect: function(dateText, inst) { 
      var dateAsString = dateText; //the first parameter of this function
      var dateAsObject = $(this).datepicker( 'getDate' ); //the getDate method
   }
});

Pierwszym parametrem jest w tym przypadku wybrana data jako łańcuch. Użyj parseDate, aby przekonwertować go na obiekt daty JS.

Zobacz http://docs.jquery.com/UI/Datepicker, aby uzyskać pełne odwołanie do interfejsu użytkownika jQuery DatePicker.

Vivek
źródło
najlepsze rozwiązanie, ponieważ nie jest wymagana żadna globalna zmienna obiektu daty
Rashid
24

Spróbuj tego, działa jak urok, podaje wybraną datę. onsubmit formularz spróbuj uzyskać tę wartość: -

var date = $("#scheduleDate").datepicker({ dateFormat: 'dd,MM,yyyy' }).val();

Odniesienie tutaj

NameNotFoundException
źródło
1

Czasami jest z tym wiele problemów. Wartość atrybutu datapicker data to 28-06-2014, ale datepicker jest pokazany lub dzisiaj albo nic. Postanowiłem tak:

<input type="text" class="form-control datepicker" data-value="<?= date('d-m-Y', (!$event->date ? time() : $event->date)) ?>" value="<?= date('d-m-Y', (!$event->date ? time() : $event->date)) ?>" />

Dodałem do wejścia atrybut data-value atrybutu datapicker, ponieważ jeśli wywołasz jQuery (this) .val () OR jQuery (this) .attr ('value') - nic nie działa. Zdecydowałem się zainicjować cyklicznie każdy datapicker i wziąć jego wartość z atrybutu data-value:

 $("form .datepicker").each(function() {
        var time = jQuery(this).data('value');
        time = time.split('-');
        $(this).datepicker('setDate', new Date(time[2], time[1], time[0], 0, 0, 0));
    });

i działa dobrze =)

realmag777
źródło
to zadziała tylko wtedy, gdy twój format daty to dmY .. jeśli masz mdY lub jakikolwiek inny format, jesteś w opasce!
Mohamed Nuur
0

Odpowiedź NamingException zadziałała dla mnie. Z wyjątkiem tego, że użyłem

var date = $("#date").dtpicker({ dateFormat: 'dd,MM,yyyy' }).val()

datepickernie działa, ale działa dtpicker.

evobe
źródło