yii2 datepicker无法渲染

Question

我想在我的应用程序中添加多个活动表单。然后，当单击（添加表单）按钮时，我使用一些jquery代码追加一些行。一切运行良好，但是在单击第二，第三行时，某些表格未显示日期选择器输入。

然后我发现第一行形式和第二行形式之间有些不同。第二种形式在输入标记中没有class =“ hasDatepicker”。

所以我从模型传递了html class =“ hasDatepicker”

public function renderTableAktivitas($form, $formAktivitas)
 {
   return Html::tag('tr',
   Html::tag('td', $formAktivitas->action) .
   Html::tag('td', $form->field($formAktivitas, 'Tanggal_Kegiatan', ['template' => '<label class="input"><i class="icon-append fa fa-calendar"></i>{input}</label>{error}'])
    ->widget(\yii\jui\DatePicker::classname(), [
    'clientOptions' => ['altField' => "yyyy-mm-dd"],
    'options' => ['class' => 'form-control hasDatepicker']
    ])
  ).
   Html::tag('td', $form->field($formAktivitas, 'Jenis_Kegiatan', ['template' => '<label class="input">{input}</label>{error}'])->widget(\conquer\select2\Select2Widget::className(), [
    'items' => [0,1,2,3,4],
    'options' => ['prompt' => '- Test select -', 'style' => 'width:100%'],
   ])) .
   Html::tag('td', $form->field($formAktivitas, 'Keterangan')->textArea()->label(false), ['style' => ['width' => 'aa50%']])
   ,['data-id' => $formAktivitas->idName]
   );
 }

class =“ hasDatepicker”现在包含在第一个和第二个表单中，但datepicker输入未同时显示在两个表单中。

这是我的jquery代码，用于在我的应用程序中添加某种形式。

body.delegate('[data-action=add_row_table_aktivitas]', 'click', function () {
    var elm = $(this);
    var tbl = elm.closest('fieldset').find('table');
    var form = elm.closest('form');
    $.ajax({
        // url: '',
        method: 'post',
        data: {'new_row_act': (tbl.find('tr').length - 1)},
        error: function (response) {
            alert_notif({status: "error", message: 'tidak bisa save'});
        },
        success: function (response) {
            var t = $(response.data);
            if ($.fn.select2 !== undefined){
                t.find('select').select2({"width":"100%"});
                t.find('.select_multi').select2({"width":"100%"});
                t.find('.summernote').summernote();
                t.find('form-control').addClass("hasDatepicker");
            }
            var tbody = tbl.find('tbody');
            if (tbody.length > 1) {
                $(tbody[0]).append(t);
            } else {
                tbody.append(t);
            }
            $.each(response.jsAdd, function (i, v) {
                var vali = eval("var f = function(){ return " + v.validate.expression + ";}; f() ;");
                v.validate = vali;
                $(form).yiiActiveForm('add', v);
            });
        }
    });

});

似乎日期选择器不仅仅是由表单输入中的class =“ hasDatepicker”触发的。因此我该如何解决我应用程序中的此问题？

Answer 1

这个问题与此相似。您可以在这里访问。 https://stackoverflow.com/a/34334388/11218275

$('body').on('focus',".datepicker", function(){

    if( $(this).hasClass('hasDatepicker') === false )  {
        $(this).datepicker();
    }

});