如何使用wbraganca-yii2-dynamicform求和动态字段？

我是新来的。 我需要帮助。 我使用一个名为“wbraganca / yii2-dynamicform”的插件。 我有一个表单允许两个字段的总和（caja1和caja2，并且add的结果是“total”）。 这很有效。 但是当我使用“ Add rows ”按钮时，我遇到了问题。 这些字段不允许添加。 只有第一行有效，但新行无效。 我怎样才能让它动态地工作？

谢谢。

我的看法。

   function Totales() { with (document.forms["dynamic-form"]) { var totalResult = Number( caja1.value ) + Number( caja2.value ); total.value = totalResult; } }  
 
Details
 


  'dynamic-form']); ?> field($modeli, 'form1')->hiddenInput(['value' => 'formito1'])->label(false); ?> 
 
 
Personal Externo
 

  'dynamicform_wrapper1', 'widgetBody' => '.form-options-body1', 'widgetItem' => '.form-options-item1', 'limit' => 3, 'min' => 1, 'insertButton' => '.add-item', 'deleteButton' => '.delete-item', 'model' => $modelsPoItem[0], 'formId' => 'dynamic-form', 'formFields' => [ 'nombre', 'tipop', 'horas', 'valorhora', 'total', ], ]); ?> 
 + Add Rows

 
  $modelOptionValue): ?> isNewRecord) { echo Html::activeHiddenInput($modelOptionValue, "[{$i}]id"); } ?> 
  
 
 
 
Name
 
Tipe
 
HH
 
Value HH ($)
 
Total ($)
 
Edit
 
 
 
 
  
 
 field($modelOptionValue, "[{$index}]nombre")->label(false); ?> 
 
 field($modelOptionValue, "[{$index}]tipop")->dropdownList([ 'Profesional' => 'Profesional', 'Tecnico' => 'Tecnico' ],['prompt'=>'Select Category'] )->label(false); ?> 
 
 field($modelOptionValue, "[{$index}]horas")->textInput(['onkeyup' => 'Totales()', 'id' =>'caja1' ])->label(false); ?> 
 
 field($modelOptionValue, "[{$index}]valorhora")->textInput(['onkeyup' => 'Totales()', 'id' =>'caja2' ])->label(false); ?> 
 
 field($modelOptionValue, "[{$index}]total")->textInput(['onkeyup' => 'Totales()', 'id' =>'total' ])->label(false); ?> 
 
  
  
  
 
  
  
 
  'btn btn-primary']) ?> 
 
  

Answer 1

_form.php这个

  field($modelOptionValue, "[{$index}]horas")->textInput(['onkeyup' => 'totales($(this))'])->label(false); ?>   field($modelOptionValue, "[{$index}]valorhora")->textInput(['onkeyup' => 'totales($(this))'])->label(false); ?>   field($modelOptionValue, "[{$index}]total")->textInput()->label(false); ?>  

JS

使用自动生成的字段ID而不是自定义ID。 您可以检查元素以查找为字段生成的id。 假设您的字段ID。 对于前者 modelOptionValue-1-horas for first field。

 function totales(item){ var index = item.attr("id").replace(/[^0-9.]/g, ""); var horas = $('#modelOptionValue-' + index + '-horas').val(); horas = horas == "" ? 0 : Number(horas.split(",").join("")); var valorhora = $('#modelOptionValue-' + index + '-valorhora').val(); valorhora = valorhora == "" ? 0 : Number(valorhora.split(",").join("")); $('#modelOptionValue-' + index + '-total').val(horas + valorhora); }