Yii2-通过jquery单击按钮时将值插入文本输入字段

Yii2- insert value to text input field on button click via jquery

我正在研究 yii2。我创建了一个 dynamic 表单。我里面有一些字段。

<div class="pull-right">
    <button type="button" id="addBtn" class="add-item btn btn-success btn-xs"><i class="glyphicon glyphicon-plus"></i></button>
    <button type="button" id="remBtn" class="remove-item btn btn-danger btn-xs"><i class="glyphicon glyphicon-minus"></i></button>
</div>
<div class="row">
    <div class="col-sm-3">
        <?= $form->field($modelTariffSlabs, "[{$i}]slab_name")->textInput(['readonly'=>true,'value'=>'S-1','maxlength' => 10]) ?>
    </div>
    <div class="col-sm-3">
        <?= $form->field($modelTariffSlabs, "[{$i}]slab_start")->textInput(['maxlength' => 10]) ?>
    </div>
    <div class="col-sm-3">
        <?= $form->field($modelTariffSlabs, "[{$i}]slab_end")->textInput(['maxlength' => 10]) ?>
    </div>
    <div class="col-sm-3">
        <?= $form->field($modelTariffSlabs, "[{$i}]rate")->textInput(['maxlength' => 10]) ?>
    </div>
</div><!-- .row -->

图形界面

我想做什么?

我想在按下 时自动添加 Slab Name。因此,当第一次加载表单时,slab 名称应为 S-1,单击添加按钮并打开新表单时,slab 名称应为 S-2 等等。

更新 1 我尝试了以下

  1. 声明并初始化一个变量为1

  2. 为该变量附加值

    <div class="col-sm-3">
                                <?= $form->field($modelTariffSlabs, "[{$i}]slab_name")->textInput(['readonly'=>true,'value'=>'S-'.$s,'maxlength' => 10]) ?>
                            </div>
    

我可以通过 jquery 获取文本输入的值。

$("#addBtn").click(function(e){
var value = $("#mdctariffslabs-0-slab_name").val();
alert(value);
    });

更新 2

我试过@Yatin的方案

 <?= $form->field($modelTariffSlabs, "[{$i}]slab_name")->textInput(['readonly'=>true,'value'=>'S-1','maxlength' => 10,"class"=>"form-control js-slab-name"]) ?>

$("#addBtn").click(function(e)
{
  $(".dynamicform_wrapper").on("afterInsert", function(e, item) 
  {
    $(".dynamicform_wrapper .js-slab-name").each(function(index) {
    $(this).html("S-" + (index + 1));
   }); 
   });
   });
 });

还有,我把它放在addBtn

外面了
$(".dynamicform_wrapper").on("afterInsert", function(e, item) 
 {
    $(".dynamicform_wrapper .js-slab-name").each(function(index) {
    $(this).html("S-" + (index + 1));
   }); 
   });
   });

还是不行。

任何帮助将不胜感激

如果您使用的是 wbraganca\dynamicform\DynamicFormWidget,那么下面的代码应该可以工作,

取widgetContainerclass

<?php DynamicFormWidget::begin([
        'widgetContainer' => "dynamicform_form_wrapper", <======= take class
        'widgetBody' => ".container-filter",
        'widgetItem' => ".filter-item",
        'limit' => 10,
        'min' => 1,
        'insertButton' => '.js-add-filter',
        'deleteButton' => '.js-remove-filter',
        'model' => $modelsCondition[0],
        'formId' => 'test-form',
        'formFields' => [
            'description'
        ],
    ]); ?>

将 class 添加到您的输入字段 - js-slab-name

<?= $form->field($modelTariffSlabs, "[{$i}]slab_name")->textInput(['readonly'=>true,'value'=>'S-1','maxlength' => 10,"class"=>"form-control js-slab-name"]) ?>

Jquery 设置您的 slab_name 增量

jQuery(".dynamicform_form_wrapper").on("afterInsert", function(e, item) {
    console.log("after insert");
    jQuery(".dynamicform_form_wrapper .js-slab-name").each(function(index) {
                 console.log("set slab-name");
        jQuery(this).val("S-" + (index + 1));
    }); 
});