Yii2-通过jquery在按钮单击上的文本输入字段中插入值 [英] Yii2- insert value to text input field on button click via jquery

问题描述

我正在研究yii2.我创建了一个动态表单.我有一些字段.

I am working on yii2. I have created a dynamic form. I have some fields in it.

<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 -->

GUI

我想做什么?

每当我按下.因此，第一次加载表单时，平板名称应为S-1，单击添加按钮并打开新表单时，平板名称应为S-2，依此类推.

I want to add the Slab Name automatically whenever I press the . So when the form is loaded for the first time the slab name should be S-1, when the add button is clicked and the new form is opened the slab name should be S-2 and so on.

更新1 我尝试了以下

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

在变量后附加值

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

我能够通过jquery获取文本输入的值.

I am able to get the value of text input via jquery.

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

更新2

我尝试了@Yatin的解决方案

I have tried @Yatin's solution

 <?= $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，则下面的代码应该有效，

If you are using wbraganca\dynamicform\DynamicFormWidget, then below code should works,

使用widgetContainer类

Take widgetContainer class

<?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'
        ],
    ]); ?>

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

Add class to your input field - 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 to set your slab_name incremental

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));
    }); 
});

这篇关于Yii2-通过jquery在按钮单击上的文本输入字段中插入值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！