javascript - 结束日期应大于 Yii Bootstrap datepickerRow 中的开始日期

Question

我正在使用 Yii bootstraps datepickerRow : Check this

我希望我的结束日期取决于开始日期。即结束日期应该大于开始日期。我花了几个小时在谷歌上检查是否有任何内置解决方案可用，但没有找到任何解决方案。然后在我编写了自己的 js 代码之后，我认为这完全没问题，但它不起作用。

我已经通过 Cjuidatepicker 实现了这一目标，并且它正在蓬勃发展。

Check my working code for yii cjuidatepicker

但我不知道为什么它不适用于 yii bootstrap datepickerRow。

如有任何帮助，我们将不胜感激。

以下是我的代码:

<?php
echo $form->datepickerRow(
        $identitycard, 'date_of_issue', array(
    'onChange' => 'setEndDate("passport_date_of_expiry", this)',
    'class' => "input-small",
    'labelOptions' => array('label' => 'Date of Issue <span class="required">*</span>'),
    'value' => $passportArr['date_of_issue'],
    'name' => 'passport[date_of_issue]',
    'readonly' => true,
    'options' => array(
        'autoclose' => true,
        'showAnim' => 'fold',
        'format' => 'yyyy-mm-dd',
        'endDate' => '-infinity'
    ),
    'prepend' => '<i class="icon icon-calendar"></i>',
    'hint' => 'yyyy-mm-dd'
        )
);
echo $form->datepickerRow(
        $identitycard, 'date_of_expiry', array(
    'class' => "input-small",
    'labelOptions' => array('label' => 'Date of Expiry <span class="required">*</span>'),
    'value' => $passportArr['date_of_expiry'],
    'name' => 'passport[date_of_expiry]',
    'readonly' => true,
    'options' => array(
        'autoclose' => true,
        'showAnim' => 'fold',
        'format' => 'yyyy-mm-dd',
    ),
    'prepend' => '<i class="icon icon-calendar"></i>',
    'hint' => 'yyyy-mm-dd'
        )
);
?>

//JS代码

function setEndDate(id, date) {
    var selectedDate = $(date).val();
    $("#" + id).datepicker({
        startDate: selectedDate,
        format: "yyyy-mm-dd"
    });
}

Answer 1

在你的js函数setEndDate中，第二个参数date不是jQuery元素(this在你的datepickerRow参数中)。无法使用 jQuery 选择器读取它。

在函数 setEndDate 中，您可以将输入值读取为 date.value; 而不是 $(date).val();

编辑:

setEndDate 函数应该可以处理此更改( refer to plugin docs 与 yiibooster 的源代码相关，例如在我的 yii-booster 安装中: protected/components/bootstrap/assets/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js ):

function setEndDate(id, date) {
    $("#" + id).val(date.value);
    $("#" + id).datepicker('setStartDate' , date.value);
}