1

ハイブリッド アプリでブートストラップ v3日時ピッカーを使用しています。アプリには日付と時刻の値を示すラベルがあります。そのため、ユーザーはいつでもclicks on the label日時ピッカーを表示して日付と時刻を選択する必要があります。私はそれを実装し、うまく機能しています。

ピッカーがポップアップしたときに、ピッカーが画面にポップアップしたときに表示する日付と時刻の値を設定できます。

$('#MetngSumryEditStartDateTime').data("DateTimePicker").date( moment( _defaultStDateTime ).format('Do MMMM YYYY, h:mm a') );  

ピッカーには、操作する入力フィールドが必要であることを忘れないでください。そのため、デバイスにテキスト フィールドを提供すると、ソフト キーボードが表示されます。ユーザーがテキストフィールドに入力することを許可されておらず、代わりに日付と時刻の値を表示するラベルがあるため、これは私の場合に本当に必要です。

このために、入力フィールドとしてチェックボックスを指定しました。Android devices現在、ピッカーはデスクトップbrowsersのようにうまく機能しますchromeが、iOS では機能しません

ここにコードの完全なリストがあります。

<div class="container">
      <div class="row">
          <div id='meetingSumDateTimeEndArea'> 
            <span class='start'>End</span> 
            <span class='time' id='meetingSumEndTime'>" + (UserProfile.getUserProfileDetails().MeetingEndTime[i]) + "</span>" 
            <span class='date' id='meetingSumEndDate'>" + UserProfile.getUserProfileDetails().MeetingEndDate[i] + "</span>"     
          </div>

          <input type='checkbox'   id='MetngSumryEditEndDateTime'  />   

      </div>
   </div>

     <script type='text/javascript'> 
          $(function() {                  
                    var _defaultStTime ='9:00 pm'; // hardcoded for testing purpose
                    var _defaultStDate ='29 Mar, 2015'; // hardcoded for testing purpose

                    var _defaultStDateTime = _defaultStDate + ' ' + _defaultStTime  ;                   
                    console.log('_defaultStDateTime=' + _defaultStDateTime  ) ; 

                    $('#meetingSumDateTimeEndArea').on('click', function(e){  
                        $('#MetngSumryEditEndDateTime').focus();  
                    });

                    $('#MetngSumryEditEndDateTime').datetimepicker( { format:'Do MMMM YYYY, h:mm a' , sideBySide: true , defaultDate: _defaultStDateTime } );                                                               
                    $('#MetngSumryEditEndDateTime').datetimepicker().on('dp.change',function(e) {  

                         $('#MetngSumryEditEndDateTime').data("DateTimePicker").date( moment( _defaultStDateTime ).format('Do MMMM YYYY, h:mm a') );    

                        console.log( e.date.format('DD MMM, YYYY')  );  

                        var tm = e.date.format('hh:mm a').split(' ');  
                        console.log( tm[0] + " " + tm[1] );                     

                        console.log( e.date.format('hh:mm a')  );   

                    }); 

            }); 

    </script> 

アップデート

以下の提案されたv4.13.28を試して設定focusOnShow: falseしましたが、それでもキーボードがポップアップします。テキストフィールドでこれを試しました。

checkboxソフトキーボードを防ぐためにフィールドに戻りましたが、iOS に問題があります。

初期の日付と時刻の値を与えるので、iOS デバイスでピッカーが開いたときに、first time it shows the current time別の時間に変更してピッカーを閉じて再度開くと、正しい最終更新時刻が表示されます。ただし、dateの場合、開くたびに正しい日付が表示されます。

したがって、日付を処理するのは良いことですが、最初の時間の値の設定にバグがあります。

どうすればこれを修正できますか?

4

2 に答える 2