DatePickerでシングルクリックで選択されていない時間 -- javascript フィールド と jquery フィールド 関連 問題

Time not getting selected with the single click in datepicker












0
vote

問題

日本語

私は2つの入力ボックスを持っています1つは日付を選択するためのものであり、その2つのボックスを検証しようとしています。これにより、日付が選択されていない場合は選択されてはいけません。 Eonasdan DatetImepickerを使用して、私は望ましい出力を得ていますが、TimePickerをシングルクリックではありません。

これまでにしたことです。

 <コード> function starttime(){              $('#starttime').datetimepicker({                    format: 'HH:mm',                    minDate: new Date()                  });             }                          $('.start_time_addon').on('click keyup',function(){              var x = $('#start').val();             if (x == '') {                alert('please select startdate first');              return false;                          }             else{                starttime();                           }                      });                    var datePickerSix= $('.datetimepicker6');            $(datePickerSix).datetimepicker({            format: 'DD/MM/YYYY',              minDate: new Date()          });  
<プリクラス= "Snippet-Code-HTML LANG-HTML Prettyprint-Override"> <コード> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker-standalone.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment-with-locales.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script> <div class="row"> <div class="col-xs-6"> <div class="form-group"> <label>Start Date</label><br> <div class='input-group date datetimepicker6'> <input type='text' class="form-control" id="start" name="date_end" placeholder="DD/MM/YYYY"/> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span> </span> </div> <div class="col-xs-6"> <div class="form-group"> <label for="start_time" class="col-form-label">Start Time</label> <div class='input-group date start_time_addon' id='starttime'> <input type='text' class="form-control" placeholder="HH : MM" id="Start_Time" required /> <span class="input-group-addon"> <span class="glyphicon glyphicon-time"></span> </span> </div> </div> </div> </div> </div> </div>

英語

I have two input boxes one is for selecting date and another for time, I am trying to validate these two boxes based on some conditions, such that if the date is not selected, the time should not get selected and i'm using eonasdan datetimepicker, i'm getting the desired output but not with the single click on a timepicker can some one help me out with this Thank you

Here's what i have done so far :

function starttime(){              $('#starttime').datetimepicker({                    format: 'HH:mm',                    minDate: new Date()                  });             }                          $('.start_time_addon').on('click keyup',function(){              var x = $('#start').val();             if (x == '') {                alert('please select startdate first');              return false;                          }             else{                starttime();                           }                      });                    var datePickerSix= $('.datetimepicker6');            $(datePickerSix).datetimepicker({            format: 'DD/MM/YYYY',              minDate: new Date()          });
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>  <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker-standalone.min.css" rel="stylesheet"/>    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment-with-locales.min.js"></script>  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>      <div class="row">        <div class="col-xs-6">            <div class="form-group">                    <label>Start Date</label><br>               <div class='input-group date datetimepicker6'>                                      <input type='text' class="form-control" id="start" name="date_end"                                             placeholder="DD/MM/YYYY"/>                                      <span class="input-group-addon">                                                                  <span class="glyphicon glyphicon-calendar"></span>                                                              </span>                                  </div>        <div class="col-xs-6">                     <div class="form-group">                     <label for="start_time" class="col-form-label">Start Time</label>                  <div class='input-group date start_time_addon' id='starttime'>                      <input type='text' class="form-control" placeholder="HH : MM" id="Start_Time" required />                      <span class="input-group-addon">                          <span class="glyphicon glyphicon-time"></span>                      </span>                  </div>              </div>                        </div>                     </div>                                      </div>                        </div>
</div
     

回答リスト

0
 
vote

 <コード>  $('.datetimepicker6').datetimepicker({            format: 'DD/MM/YYYY',              minDate: new Date()            });         $('.datetimepicker6').on("dp.change", function(e) {              $('#starttime').datetimepicker({                                  format: 'HH:mm',                    minDate: new Date()                  });    });  
<プリクラス= "Snippet-Code-HTML LANG-HTML Prettyprint-Override"> <コード> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker-standalone.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment-with-locales.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script> <div class="row"> <div class="col-xs-6"> <div class="form-group"> <label>Start Date</label><br> <div class='input-group date datetimepicker6'> <input type='text' class="form-control input_date" id="start" name="date_end" placeholder="DD/MM/YYYY"/> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span> </span> </div> <div class="col-xs-6"> <div class="form-group"> <label for="start_time" class="col-form-label">Start Time</label> <div class='input-group date start_time_addon' id='starttime'> <input type='text' class="form-control" placeholder="HH : MM" id="Start_Time" required /> <span class="input-group-addon"> <span class="glyphicon glyphicon-time"></span> </span> </div> </div> </div> </div> </div> </div>
 

 $('.datetimepicker6').datetimepicker({            format: 'DD/MM/YYYY',              minDate: new Date()            });         $('.datetimepicker6').on("dp.change", function(e) {              $('#starttime').datetimepicker({                                  format: 'HH:mm',                    minDate: new Date()                  });    });
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>  <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker-standalone.min.css" rel="stylesheet"/>    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment-with-locales.min.js"></script>  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>      <div class="row">        <div class="col-xs-6">            <div class="form-group">                    <label>Start Date</label><br>               <div class='input-group date datetimepicker6'>                                      <input type='text' class="form-control input_date" id="start" name="date_end"                                             placeholder="DD/MM/YYYY"/>                                      <span class="input-group-addon">                                                                  <span class="glyphicon glyphicon-calendar"></span>                                                              </span>                                  </div>        <div class="col-xs-6">                     <div class="form-group">                     <label for="start_time" class="col-form-label">Start Time</label>                  <div class='input-group date start_time_addon' id='starttime'>                      <input type='text' class="form-control" placeholder="HH : MM" id="Start_Time" required />                      <span class="input-group-addon">                          <span class="glyphicon glyphicon-time"></span>                      </span>                  </div>              </div>                        </div>                     </div>                                      </div>                        </div>
</div
 
 
 
 

関連する質問

0  jQuery、属性フィルタセレクタ、および正確に_which_要素をクリックした  ( Jquery attribute filter selectors and finding out exactly which element was c ) 
私はこのjqueryがうまく機能する <事前> <コード> $("li[id^='shop_id']").click( function () { alert("I clicked on id ??"); }); 'shop_id'でIDを持つ...

2  OnClick HandlerをMake Linksのクリックを無視します  ( Make onclick handler ignore clicks on links ) 
ブロック要素のカスタムオンクロックハンドラ(jQueryの.click()メソッドを介して設定)。このブロック要素にはリンクを含めることができます。 これはかなり確信があるので、クリックしたリンクである場合(リンクが私のコードを実行せずに訪問されるように)ハン...

1  $$ jQueryでは、これは何ですか?  ( In jquery whats this used for ) 
誰かが書くだけの場合: <事前> <コード> $("#downloadTabs>div").each(function(el) { el.setStyle("display", "none"); el.removeCla...

1279  jQueryでクッキーを設定/設定解除するにはどうすればよいですか。  ( How do i set unset a cookie with jquery ) 
jQueryを使用してCookieを設定して設定します。たとえば、 test という名前のクッキーを作成し、 1 ?に設定します。 ...

1  JsonResultの問題  ( Jsonresult problem ) 
これを返しているActionResultがあります。 <事前> <コード> @output4 JavaScriptでは、そのaticationResultによって返される値は "{" isDeleted ":true}"です。 私は何をしていますか? 編...

11  スライド後のjQueryスライダコール機能  ( Jquery slider call function after slide ) 
私はWebアプリケーション上でスコアを設定するために使用しているjQuery Silderを持っています。ユーザーが送信ボタンをクリックしたが、クライアントはAjaxスタイルを更新するようになったままにするようにOrignallyにいました。 これは見つけられ...

210  jQueryセレクタから$(これを)除外する方法は?  ( How can i exclude this from a jquery selector ) 
私はこのようなものを持っています: <事前> <コード> <div class="content"> <a href="#">A</a> </div> <div class="content"> <a href="#">B</a> </div>...

0  リスト項目でディスクを取り除く  ( Getting rid of disc in list item ) 
jQueryを使用してサイトを開発し、jQuery UIタブを作成しています。何らかの理由で、私のタブ(順序付けられていないリスト)は、OS XのFirefox 3を除くすべてのブラウザ(これまでにテスト済み)に弾丸を表示しています.Safari OS X、...

0  jQueryの$ .click()内のインデックス番号を取得する方法  ( How to get index number inside click of jquery ) 
<事前> <コード> $("span.ws_label").click(function() { }) セレクタ「span.ws_label」選択した5つの要素、 そのうちの1つをクリックしたとき、 実際にどれを知るか? 編集 I索引やそのIDを...

2  jQueryのAjaxForm  ( Ajaxform in jquery ) 
Ajaxformを使用しています。今私は問題に遭遇しました。私のアイデアは、ユーザーがユーザー名を入力したときに、誤ったユーザー名がユーザーにメッセージを報告する必要があります。 私のコードはうまくいっていますが、ユーザーに表示されたレポートメッセージの後、...




© 2022 cndgn.com All Rights Reserved. Q&Aハウス 全著作権所有