【Yii】【jQuery】【Bootstrap】動的にフォームを追加時にDatepickerが表示されない

Yiiのdynamicform
GitHub - wbraganca/yii2-dynamicform: It is widget to yii2 framework to clone form elements in a nested manner, maintaining accessibility.
を使って
Bootstrapのdatepicker
bootstrap-datepicker — bootstrap-datepicker documentation
を表示させたかったんだけど、うまく表示されなかったのでメモ。

<?php DynamicFormWidget::begin([
...
    <td class="date">
    <?=  $form->field($value, "[{$index}]date") ;?></td>
...
<?php DynamicFormWidget::end(); ?>

こんな感じでフォームを追加していて

$(".dynamicform_wrapper").on("afterInsert", (function(e, item){
}

プラスボタン(フォームの追加)を押すと上の関数が呼ばれるんだけど、ここでdatepickerがクリックしても表示されないという状況。
これはクリックイベントを取得した時に$(this)を渡して

$(document).on("click",".date .form-control ", (function(){
    setDatePicker($(this));
}));

function setDatePicker(item){
    item.datepicker({
        todayHighlight: true,
        format: 'yyyy-mm-dd',
        autoclose: true,
    })
    item.datepicker('show');
}

こんな感じで'show'をしてあげないと表示されないみたい。

これで表示はされたんだけど、なぜかカッコ悪いカレンダーだったので

スタイルを無理やり.attr()とか.css()とかで似せて対処した。

その時に、!importantとかで指定したい時もちょっとだけ躓いたのでメモメモ。
スタイルは以下のように追加した。

    //カレンダーのスタイル修正
    var datePicker = $(".datepicker");
    var getActiveDay = $('tr').find('.active.day');

    if(getActiveDay.length === 0){
        $('.today.day').attr('style', 'background: #428BCA !important');
        $('td.today.day').css('color', '#fff');

    }else{
        $('.today.day').attr('style', 'background: #fff !important');
        $('td.today.day').css('color', '#333');
    }

    datePicker.css('text-align','center');
    datePicker.css('height', '260px');
    $('.datepicker-switch').css('text-align','center');
    $('.active.day').attr('style', 'background: #428BCA !important');
    $('td.active.day').css('color', '#fff');
    $('.prev').css('text-align','center');

完成後はこんな感じ。

色んなプラグインとか組み合わさってるとめんどくさい。