web-dev-qa-db-ja.com

リンククリック時にjquerydatepickerを表示するにはどうすればよいですか?

リンクにjquery datepickerを表示する必要がありますクリックまた、日付が選択されたときに、リンクテキストをこの日付に変更するにはどうすればよいですか?

12
Burjua

jQuery UI日付ピッカー ジョブを実行する必要があります。

アイコンを使用してピッカーをトリガーする例を確認してください: http://jqueryui.com/demos/datepicker/#icon-trigger

また、show()メソッドを呼び出して、必要なときにいつでもピッカーをドロップダウンすることもできます。

$('#mypicker').datepicker({
      //options
      minDate: '20.04.2012'
      //...
    });
$('#mylink').click(function(){
      $('#mypicker').datepicker('show');
    });

日付を選択した後でリンクテキストを変更するには、初期化コードで次のようなものを使用します。

$('#mypicker').datepicker({ onSelect:
    function(dateText, inst) {
        $('#mylink').text(dateText);
    }
});
15
DigitalDan

まあ、この投稿で返信するのは遅いかもしれませんが、ここに素晴らしい アンドリューからの解決策 があります。これは2015年に機能します。

一言で言えば、リンクと空のdivの直後に非表示の入力を配置する必要があります。最後のものがトリックを行います。

また、リンククリックイベントは不要です。

0
slashka
$("#dateField").datepicker({
 dateFormat:'dd/M/yy',
 minDate: 'now',
 changeMonth:true,
 changeYear:true,
 showOn: "focus",
 //buttonImage: "YourImage",
 buttonImageOnly: true, 
 yearRange: "-100:+0",  
}); 

$("dateField").datepicker( "option", "disabled", true );
0
Girish

これは私のために働いた。 jquery-ui.lsおよび.cssが必要です。

 $( function() {
            $( "#from" ).datepicker({
                changeMonth: true,
                changeYear: true
            });
            $( "#to" ).datepicker({
                changeMonth: true,
                changeYear: true
            });
0