jQuery UI datepicker - Versuchen zu erfassen, klicken Sie auf Ereignis vom Datum geklickt

Verwenden wir jquery-UI-1.8.23 an meinem Arbeitsplatz.

Wie kann ich capture das Datum geklickt haben, datepicker, so kann ich das format das aktuelle Datum in einen Zeitstempel und übergeben Sie diesen Wert in einem versteckten Formularfeld?

Hier ist etwas code, den ich versucht habe zu bekommen arbeiten:

$('.ui-state-default').live('click', function(){
    console.log('date clicked');
    var currentdate = $(this).text();
    var d = currentdate;
    var m = monthFormat($('.ui-datepicker-month').text());
    var y = $('.ui-datepicker-year').text();
    $('a.ui-state-default').removeClass('ui-state-highlight');
    $(this).addClass('ui-state-highlight');

    if (currentdate.length < 2) {
    d = "0" + currentdate;
    }
    var datestamp = y + "-" + m + "-" + d;
    console.log(datestamp);
    $('#dateHidden').val(datestamp);
});

Dank für das betrachten meiner code, den ich schätzen jede Hilfe, die Sie Jungs anbieten können.

InformationsquelleAutor James Pickering | 2013-09-05
  1. 16

    Brauchen Sie nicht alles zu tun, um das Datum zu formatieren. Die DatePicker widget macht es für Sie.
    Verwenden Sie einfach die altField und altFormat Eigenschaften:

    $("#myDatePicker").datepicker({
    //The hidden field to receive the date
    altField: "#dateHidden",
    //The format you want
    altFormat: "yy-mm-dd",
    //The format the user actually sees
    dateFormat: "dd/mm/yy",
    onSelect: function (date) {
        //Your CSS changes, just in case you still need them
        $('a.ui-state-default').removeClass('ui-state-highlight');
        $(this).addClass('ui-state-highlight');
    }
});

    Dokumentation:

    http://api.jqueryui.com/datepicker/#option-altField

    http://api.jqueryui.com/datepicker/#option-altFormat

    Demonstration:

    http://jsfiddle.net/sFBn2/10/

    • und wie ist, dass die Ausgabe einen Wert in ein verstecktes Feld?
    • Es tut es automatisch. Das ist es, was die altField ist es für.
    • OK, aber wie kann ich feststellen, ob der Wert übergeben wird, um das versteckte Feld, wenn Chrome developer tools nicht aktualisieren, während der onSelect-event?
    • Überprüfen Sie die jsFiddle habe ich Hinzugefügt, um die Antwort.
    • Funktioniert als standalone-fiddle, aber die hidden-Feld Hinzugefügt, mithilfe der append() und die id ist anders. Hier ist meine Gabel jsfiddle.net/bitmapshades/LFpwN/2
    • Eine Lösung passt nicht für alle Szenarien. Die Antwort basiert auf der Frage-Szenario. Wenn Sie das hinzufügen von Elementen dynamisch dem DOM, natürlich müssen Sie tun, passen Sie die Lösung. Ich benutze diese auf jeden einzelnen ASP.NET Projekt, das ich habe. Beide WebForms und MVC mit festen HTML-markup oder selbst generiert. Es ist nie gescheitert. Die Dokumentation ist auf der post. Auch die jQuery - Selektor basiert nicht nur auf Elemente IDs. Sie haben Tausende von Möglichkeiten, es zu benutzen.
    • Vielen Dank für Ihre Kommentare.
    • Keine Sorge. Froh zu helfen.

    InformationsquelleAutor melancia
  2. 1

    jQuery Datepicker die Möglichkeit gibt Formatierung Datum. Also, warum nicht Sie machen?

    $('element').datepicker({ dateFormat: 'dd-mm-yy' });

    Auch Sie brauchen nicht eine separate Methode zur Erfassung der click-Ereignis. Die Standard-Methode onSelect

    $('input').datepicker({
 dateFormat: 'yy-mm-dd',
    onSelect: function (date) {
    //defined your own method here
    alert(date);
    }
})

    Überprüfen Sie diese JSFiddle

    • Darf ich wissen, den Grund für downvote?
    • all das unterstützt wird, setzen Sie das Attribut class="hasDatepicker" auf das ausgeblendete Feld. (Ich habe nicht nach unten Stimmen Sie mir).
    • Sie versuchen, weisen Sie den Wert für ein hidden-Feld. Ich könnte nicht bekommen, was Sie hinzuzufügen versuchen datepicker-Klasse?Korrigieren Sie mich, wenn ich falsch war.
    • Ich war mir gar nicht bewusst, dass ich brauchte, um das datepicker-Klasse zu erfassen, klicken Sie auf ein Ereignis, mit dem datepicker-Komponente, bis heute aber vielen Dank für Geläute in.
    • Ich bin froh, dass ich helfen konnte 🙂
    InformationsquelleAutor Praveen
  3. 1
    $('#calendar').datepicker({
        inline: true,
        firstDay: 1,
        changeMonth: false,
        changeYear: true,
        showOtherMonths: true,
        showMonthAfterYear: false,
        yearRange: "2015:2025",      
        dayNamesMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
        dateFormat: "yy-mm-dd",
        onSelect: function (date) {
            alert(date);
        }
    });
    • Sollten Sie eine Beschreibung hinzufügen, um Ihre Lösung.
    InformationsquelleAutor PSN-RaffyBoy81
  4. 0

    Ihre datepicker hört, dass.

    sehen onSelect () - Funktion

    Aufgerufen, wenn der datepicker ausgewählt ist. Die Funktion erhält das ausgewählte Datum als text und das datepicker-Instanz als Parameter. dies bezieht sich auf das zugehörige Eingabefeld.

    $('.date-pick').datepicker( {
    onSelect: function(date) {
        //play with date here
    },
----
----
---
    InformationsquelleAutor Suresh Atta
Schreibe einen Kommentar