Question

我使用yii2动态表单wbraganca来创建动态行。这对我来说很好。我在表单中有一个类别下拉列表，其中onchange im根据下拉列表中的值加载a。如果下拉列表中的值是其他值？然后我加载这个div，它有一个文本框，用户可以在其中输入他的其他类别。

当我点击新行时，第一行的onchange正常工作，将生成一个新行，但另一个选项是不加载文本框。

下面是我的表单代码和java脚本代码。

     <?=   $form->field($bill, "[{$index}]category")->dropDownList(['Grocery' =>'Grocery', 'Power' => 'Power', 'Electricity' => 'Electricity', 'Water' => 'Water','others'=>'others'],['prompt'=>'Select...','onchange' => 'return showout(this.value)'])->label(false); ?>

在更改时加载的Div

  <div   id="mydiv" style="display: none;width: 88px;">
  <?= $form->field($bill, "[{$index}]other_category")->textInput(['maxlength' => true]) ?>  
  </div>

Java脚本代码

 <script type="text/javascript">
    function showout(a)
{
    if (a == 'others') {
        $('#mydiv').show();
    } else {
        $('#mydiv').hide();
    }
}
</script>

Answer 1

使用class代替id：

<?= $form->field($bill, "[{$index}]category")->dropDownList(['Grocery' =>'Grocery', 'Power' => 'Power', 'Electricity' => 'Electricity', 'Water' => 'Water','others'=>'others'],['prompt'=>'Select...', 'onchange' => 'showout($(this))'])->label(false); ?>
<div class="mydiv" style="display: none;width: 88px;">
    <?= $form->field($bill, "[{$index}]other_category")->textInput(['maxlength' => true]) ?>  
</div>

<强> JS

function showout(category)
{   
    var index  = category.attr("id").replace(/[^0-9.]/g, "");
    if (category.val() == 'others') {
        $("#bill-"+index.concat("-other_category")+"").closest('.mydiv').show();
    } else {
        $("#bill-"+index.concat("-other_category")+"").closest('.mydiv').hide();
    }
}

Yii2动态形式wbraganca onchange不wowrking

1 个答案: