1

デフォルトではhttp://amsul.ca/pickadate.js/index.htmで、ユーザーが入力をクリックするとウィジェットがレンダリングされます。

アイコンを作成しました。ユーザーがアイコンをクリックすると、ウィジェットが表示されます。私は試しました:

$('#my-icon').on('click', function(){
   $("input.dateFormat").pickadate();
   $("input.dateFormat").click(); // Tried also with trigger
});

しかし、カレンダーは表示されません。

やり方がある?

4

4 に答える 4

4

クリックをトリガーすること(受け入れられた解決策)は、これを行う正しい方法ではないと思います。pickadate.js のバージョン 3 API を使用して、開く/閉じるオプションの概要を以下に示します: http://amsul.ca/pickadate.js/api.htm#method-open-close

コードは次のようになります。

var $input = $('.datepicker').pickadate();
var picker = $input.data('pickadate');
$('.calendarIcon').click( function( e ) {
    // stop the click from bubbling
    e.stopPropagation();
    // prevent the default click action
    e.preventDefault();
    // open the date picker
    picker.open();
});
于 2014-05-29T19:00:43.010 に答える
1

私もこのライブラリについてよく知りませんが、彼らの「api」ページをざっと見てみると、おそらく次のようなものを探しているのではないかと思います。

var picker = $("input.dateFormat").pickadate();
$("#my-icon").on('click', function() {

    if(picker.get('open')) {
        picker.close();
    } else {
        picker.open();
    }
}
于 2013-09-09T13:17:39.507 に答える
0

これは私のために働いた:

<html><head>
      <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.js"></script>
      <script type="text/javascript" src="http://amsul.ca/pickadate.js/vendor/pickadate/lib/picker.js"></script>
      <script type="text/javascript" src="http://amsul.ca/pickadate.js/vendor/pickadate/lib/picker.date.js"></script>
      <script type="text/javascript" src="http://amsul.ca/pickadate.js/vendor/pickadate/lib/picker.time.js"></script>
      <link rel="stylesheet" type="text/css" href="http://amsul.ca/pickadate.js/vendor/pickadate/lib/themes/classic.css">
      <link rel="stylesheet" type="text/css" href="http://amsul.ca/pickadate.js/vendor/pickadate/lib/themes/classic.date.css">
      <link rel="stylesheet" type="text/css" href="http://amsul.ca/pickadate.js/vendor/pickadate/lib/themes/classic.time.css">

<script type="text/javascript">
$(window).load(function(){
  $('#inputDatetime').pickadate({
    //format: 'dd. mmmm yyyy',
    format: 'dd-mm-yyyy',
    formatSubmit: 'dd-mm-yyyy',
  });
});

$(document).ready(function() {
    $("#my-icon").click(function(){
        $( '#inputDatetime' ).pickadate("open"),
        event.stopPropagation(),
        event.preventDefault()
    });
});

</script></head>

<body>

    <input
      id="inputDatetime"
      name=""
      class=""
      type="text"
      placeholder="Try me&hellip;">
    <img src='https://cdn2.iconfinder.com/data/icons/windows-8-metro-style/128/calendar.png' id="my-icon">
</body>


</html>
于 2016-04-08T21:01:35.137 に答える
-1

私は本当にこのライブラリを知りません。

カレンダーの init をハンドラーの外部に保持してから、入力でクリックをトリガーする必要があります。

$("input.dateFormat").pickadate();

$(document).ready(function() {
    $("#my-icon").click(function(){
        $( '.input.dateFormat' ).trigger("click")
    });
});
于 2013-09-09T13:10:28.057 に答える