使用动态表单YII2动态生成Id时如何使用onchange

Question

我有多个下拉列表，其id由wbraganca Dynamic Form自动生成，例如：第一个下拉菜单的 ID 如：#formquestion-0-formquestiontypeid ，第二个下拉列表将具有 ID，例如：#formquestion-1-formquestiontypeid , n-dropdown 将有 ID 如: #formquestion-(n-1)-formquestiontypeid

我想在每个下拉菜单中调用 ONCHANGE。但是我不知道ID，因为ID是wbraganca Dynamic Form自动生成的。

$('#formquestion-{$i}-formquestiontypeid').change(function(){console.log('enter');});

我在动态表单 For 循环中尝试了这个 jquery 代码但是 jquery ID 仅响应具有 ID 的下拉列表：#formquestion-0-formquestiontypeid

<?php
    foreach ($formQuestionModels as $i => $formQuestionModel): 
?>
  <div class="item panel panel-default">
    <!-- widgetBody -->
    <div class="panel-heading">
      <h3 class="panel-title pull-left">Question</h3>
      <div class="pull-right">
        <button type="button" class="add-item btn btn-success btn-xs"><i class="glyphicon glyphicon-plus"></i></button>
        <button type="button" class="remove-item btn btn-danger btn-xs"><i class="glyphicon glyphicon-minus"></i></button>
        <?php 
                  $Formquestiontype=Formquestiontype::find()->all();
                  $listData=ArrayHelper::map($Formquestiontype,'formQuestionTypeID','formQuestionTypeName');

                  echo $form->field($formQuestionModel, "[{$i}]formQuestionTypeID")->dropDownList(
                          $listData,
                          [   
                              'class' => "",
                              'prompt' =>'Select...'
                          ]);                          

                  $this->registerJs("                                         
                      $('#formquestion-{$i}-formquestiontypeid').change(function(){
                          var value = this.value;
                          console.log(value);
                      });

                  ");
              ?>
      </div>
      <div class="clearfix"></div>
    </div>
    <div class="panel-body">
      <?php
              // necessary for update action.
              if (!$formQuestionModel->isNewRecord) {
                  echo Html::activeHiddenInput($formQuestionModel, "[{$i}]id");

              }
          ?>
        <?= $form->field($formQuestionModel, "[{$i}]formQuestionName")->textInput(['maxlength' => true]) ?>
          <div class="row">
            <div class="col-sm-6">
              <?= $form->field($formQuestionModel, "[{$i}]formDescription")->textInput(['maxlength' => true]) ?>
            </div>
            <div class="col-sm-6">
              <?= $form->field($formQuestionModel, "[{$i}]formRequired")->textInput(['maxlength' => true]) ?>
            </div>
          </div>
          <!-- .row -->
          <div class="row">
            <div class="col-sm-4">
              <!-- <?= $form->field($formQuestionModel, "[{$i}]formQuestionTypeID")->textInput(['maxlength' => true]) ?> -->
            </div>
            <div class="col-sm-4">
              <?= $form->field($formQuestionModel, "[{$i}]formImage")->textInput(['maxlength' => true]) ?>
            </div>
            <div class="col-sm-4">
              <?= $form->field($formQuestionModel, "[{$i}]formQuestionPosition")->textInput(['maxlength' => true]) ?>
            </div>
            <div class="col-sm-4">
              <?= $form->field($formQuestionModel, "[{$i}]formQuestionSection")->textInput(['maxlength' => true]) ?>
            </div>
          </div>
          <!-- .row -->
    </div>
  </div>
  <?php endforeach; ?>

Answer 1

这个问题解决了，我只需要将我所有的jquery插入这个JQUERY代码中：

jQuery(".dynamicform_wrapper").on("afterInsert", function(e, item) {
    jQuery(".dynamicform_wrapper .panel-title").each(function(index) {
        // Insert your code (javascript, JQUERY, etc) here
    });
});

使用动态表单YII2动态生成Id时如何使用onchange

How to use onchange when the Id is generated Dynamically using Dynamic Form YII2

jquery

yii2-basic-app

dynamicform