Добавить класс в bootstrap textbox - yii2

Question

У меня есть форма в yii2. В этом случае у меня есть поле ввода, как показано ниже.

<input type="text" class="form-control" id="productsales-<?= $i ?>-value"> 

Он находится в динамической форме и не приходит из любой модели. Это просто для того, чтобы удерживать определенное значение. А идея заключается в вычислении значения fileed пользователей в этой области на другое текстовое поле, как показано ниже -

<?= $form->field($model, 'amount')->textInput(['maxlength' => true, 'class' => 'sum']) ?> 

У меня уже есть яваскрипт код, чтобы вычислить общее количество, как показано ниже -

<?php 
/* start getting the total amount */ 
$script = <<<EOD 
    var getSum = function() { 

     var items = $(".item"); 
     var sum = 0; 

     items.each(function (index, elem) { 
      var priceValue = $(elem).find(".sumPart").val(); 
      //Check if priceValue is numeric or something like that 
      sum = (parseFloat(sum) + parseFloat(priceValue)).toFixed(2); 
     }); 
     //Assign the sum value to the field 
     $(".sum").val(sum); 
    }; 

    //Bind new elements to support the function too 
    $(".container-items").on("change", ".sumPart", function() { 
     getSum(); 
    }); 
EOD; 
$this->registerJs($script); 
/*end getting the total amount */ 
?> 

Пожалуйста, обратите внимание, что у меня есть класс sum во втором текстовом поле, которое исходит от модели. Мой вопрос заключается в том, как я могу добавить класс (sumPart), подобный этому (sum) в первом текстовом поле, которое не приходит из модели.

Update после обсуждения с Безумный Череп

У меня динамический вид, как показано ниже Я хочу, чтобы вычислить сумму всех записей в стоимости и передать его в размере.

Код Значение является -

<input type="text" class="form-control sumPart" id="productsales-<?= $i ?>-value"> 

Код Сумма является -

<?= $form->field($model, 'amount')->textInput(['maxlength' => true, 'class' => 'sum']) ?> 

Javascript Я пробовал уже дан выше. Проблема с этим кодом - это «значение», которое не передается в текстовое поле.

Обновление: небольшая проблема

Answer 1

Изменить JS:

$this->registerJs(' 
    function getSum() { 
     var sum = 0; 
     var items = $(".item"); 
     items.each(function (index, elem) { 
      var priceValue = $(elem).find(".sumPart").val(); 
      sum = parseFloat(sum) + parseFloat(priceValue); 
     }); 

     if(isNaN(sum) || sum.length == 0) { 
      sum = 0; 
     } 
     $(".sum").val(sum); 
    } 

    $(".container-items").on("change", function() { 
     getSum(); 
    }); 

    jQuery(".dynamicform_wrapper").on("afterDelete", function(e) { 
     getSum(); 
    }); 
'); 

Answer 2

Я немного не уверен о проблеме вы столкнулись. Если вы хотите добавить класс в поле ввода, вы можете легко сделать это в атрибуте class входного тега. И атрибут class поддерживает несколько значений, так что вы можете написать что-то вроде этого:

<input type="text" class="form-control sumPart" id="productsales-<?= $i ?>-value"> 

** UPDATE - на основе замечаний по ФП **

@Tanmay, я понимаю, что вы не можете быть получение желаемого результата. Тем не менее, не важно, будем ли мы обрабатывать поля с использованием $form->field() или простого HTML. Если поля имеют соответствующие классы, то код JS, отправленный Kostas в вашей ссылке, должен работать - независимо от того, как имя класса было добавлено в поле ввода.

Можете ли вы подтвердить (используя элемент Inspect), если класс sumPart фактически назначен соответствующим полям после загрузки страницы? Может быть, некоторые JS снова перезаписывают атрибут класса?

Если классы назначены должным образом, проверьте, есть ли в консоли какие-либо ошибки JS, которые могут помешать правильному исчислению суммы JS.