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?

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

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.


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



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 =)


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.

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.