アイコンをクリックしてもカレンダーは表示されませんが、入力フィールドをクリックして表示されます

Question

私はブートストラップのdatepickerプラグインを使用しました。しかし、アイコンをクリックしてもカレンダーは表示されません。カレンダーを表示するには入力フィールドをクリックする必要がありますか？

<label for="dob" class="col-md-4 control-label">Date Of Birth</label> 
     <div class="col-md-6"> 
      <div class="input-group date"> 
       <input id="dob" class="form-control datepicker" placeholder="2012-02-12" type="text" name="dob" value="{{ old('dob') }}" required autofocus> 
      <div class="input-group-addon"> 
       <span class="glyphicon glyphicon-th"></span> 
      </div> 
    </div> 

スクリプト：

$('.datepicker').datepicker({ 
      format: 'yyyy-mm-dd' 
    }); 

私は親要素にIDを追加した後：

<label for="dob" class="col-md-4 control-label">Date Of Birth</label> 
      <div class="col-md-6"> 
       <div class="input-group date" id="datepicker"> 
        <input id="dob" class="form-control datepicker" placeholder="2012-02-12" type="text" name="dob" value="{{ old('dob') }}" required autofocus> 
       <div class="input-group-addon"> 
        <span class="glyphicon glyphicon-th"></span> 
       </div> 
     </div> 

とスクリプト：

$('#datepicker').datepicker({ 
     format: 'yyyy-mm-dd' 
}); 

これは、コンソールにエラーを与える：

を

Uncaught TypeError: Cannot read property 'split' of undefined

この正確なWorking fiddleも機能しません。

Answer 1

ブートストラップには独自のdatepickerがありません。私の予想通り、https://bootstrap-datepicker.readthedocs.io/en/latest/を使用している必要があります。 そうであれば、カレンダーが機能するためのすべての依存関係が必要です。

Answer 2

$('.glyphicon-th').click(function() { 
$(".datepicker").focus(); 
}); 

はい、それはコンソール `キャッチされない例外TypeErrorにエラーが表示さ@rasmeister日付ピッカー