jQuery-UI Datepicker：ドラッグ可能？

Question

（うまくいけば）簡単な質問：

jQuery UIのDatePickerをドラッグ可能にすることはできますか？もしそうなら、誰か私にサンプルコードを教えてもらえますか？

Answer 1

$（ "。ui-datepicker"）draggable（） は機能しません。

Answer 2

この順序は重要です。

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

EDIT：回答@JZ用品や鉱山の間に微妙な違いがあります。 JZの例を使用すると、ページ上の任意のdatepickerがインライン（input要素の代わりにDIVに関連付けられているもの）であっても、ドラッグ可能になります。私のコードはポップアップのdatepickersをドラッグ可能にするだけです。 datepickerプラグインは、すべてのポップアップに対して単一のDIV（ui-datepicker-divという名前）を作成し、datepickerが適用されたページの入力に対してその名前を再利用します。インラインDIVまたはSPANの場合、.ui-datepickerクラスを持つDIV/SPAN内に新しい名前のない日付ピッカーを作成しますが、その名前はありません。この場合、私のコードはdatepickerをドラッグ可能にするわけではありませんが、おそらく正しい動作ですが、JZはクラスに基づいて一致します。

例：

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

Answer 3

あなたは日付ピッカーにイベントを追加し、それをドラッグするためにそれを使用することができます。

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

Example jsfiddle