JQuery-UI Datepicker: Draggable?

(Hopefully) A simple question:

Is it possible to drag jQuery UI Datepicker? If so, can someone give me some sample code?

+5
source share
3 answers

$ ("UI-DatePicker"). Draggable () doesn't work?

+9
source

Order is important.

$('#myCalendarInput').datepicker();
$('#ui-datepicker-div').draggable();

. @JZ . JZ, , , ( DIV ). popup datepickers draggable. datepicker DIV ( ui-datepicker-div) , datepicker. DIV SPAN , DIV/SPAN, .ui-datepicker, . datepicker , , , JZs , .

:

<script type="text/javascript">
$(document).ready(function() {
    $('#calendar').datepicker();
    $('#calendar2').datepicker();
    $('#calendar3').datepicker();
    $('#ui-datepicker-div').draggable();
});
</script>

<div>
Calendar: <input id="calendar" type="text" /><br />  <-- draggable
Calendar2: <input id="calendar2" type="text" /><br/> <-- draggable
Fixed calendar: <div id="calendar3"></div> <-- fixed
</div>
+6

datepicker .

//Add an event "onCreate"
$.datepicker._updateDatepicker_Old = $.datepicker._updateDatepicker;
$.datepicker._updateDatepicker = function(inst) {
    this._updateDatepicker_Old(inst);

    var onCreate = this._get(inst, 'onCreate');
    if (onCreate !== null) {
        onCreate(inst);
    }
};

datepicker onCreate, .

$(function() {
    //Create datepicker
    $('#datepicker').datepicker({
        onCreate: function(inst) {
            $(inst.dpDiv).draggable();
        }
    });
});​

jsfiddle

+2

All Articles