Функция JQuery не обновляет весь столбец

Question

Я новое программирование в JQuery, и у меня есть проблема на моей веб-странице, когда функция jquery выбрасывается.

Это мой веб-страницу, если вы хотите сделать какой-нибудь тест www.nutrinet.hol.es/index6.php

Если какой-либо продукт выбран, столбец «Унидад Maxima» и изменения «Унидад минимумами».

Но когда выбран другой продукт (например, 3-й), изменяется только их ряд, а следующие строки изменяются, остальные строки (2-й и 1-й) все еще не обновлены.

Это моя функция jquery. Val3 = поля столбцов Unidades elegidas.

$(document).ready(function() { 



    $(".txtMult input").keyup(multInputs); 

    function multInputs() { 

     var mult = 0; 
     var sum = 0; 
     var cantidadfinal = 0; 
     var preciofinal =0; 
     var cantidadesminimas = 0; 

       var cantidadesmaximas = 0; 


     // for each row: 
     $("tr.txtMult").each(function() { 


      // get the values from this row: 
      var $val1 = $('.val1', this).val(); 
      var $val2 = $('.val2', this).val(); 
      var $val3 = $('.val3', this).val(); 
      var $val4 = $('.val4', this).val(); 



      var $total = ($val1 * 1) * ($val2 * 1) 
      var $cantidadestotales = ($val3 * 1) * ($val2 * 1) 
      var $preciostotales = ($val4 * 1) * ($val2 * 1)   


      mult += $total; 

      cantidadfinal += $cantidadestotales; 

      preciofinal += $preciostotales; 

      sum += parseFloat($val2); 

      cantidadesminimas = (8260 - cantidadfinal)/$val3 

      cantidadesmaximas = (12390 - cantidadfinal)/$val3 


      $('.val5',this).html(cantidadesminimas.toFixed(0)); 

       $('.val6',this).html(cantidadesmaximas.toFixed(0)); 



     }); 

     $("#precio").html(preciofinal.toFixed(0)); 
     $("#cantidadelegida").html(cantidadfinal.toFixed(0)); 
     $("#sum").html(sum.toFixed(0)); 
     $("#grandTotal").html(mult.toFixed(0)); 
     $("#cantidadmin").html(8260-cantidadfinal.toFixed(0)); 
     $("#cantidadmax").html(12390-cantidadfinal.toFixed(0)); 
     $("#kcaltotal").html(14000-mult.toFixed(0)); 

    } 

});

Любой комментарий будет очень оценен. Спасибо!

Answer 1

Хорошо, получилось. Дело в том, что переменные cantidadesminimas и cantidadesmaximas зависят от значения cantidadfinal, и мы не знаем действительного значения cantidadfinal, пока мы не прошли через все строк. Это приводит к ошибке: если строка x приходит после строки y, ее cantidadfinal не принимает во внимание значения строки y и поэтому остается неизмененной. Самое быстрое решение - это цикл дважды: во-первых, для вычисления cantidadfinal и другого цикла для установки правильных значений в .val5 и .val6.

$(".txtMult input").keyup(multInputs); 
function multInputs() { 
    var mult = 0; 
    var sum = 0; 
    var cantidadfinal = 0; 
    var preciofinal = 0; 
    var cantidadesminimas = 0; 
    var cantidadesmaximas = 0; 

    // for each row: 
    $("tr.txtMult").each(function() { 
     // get the values from this row: 
     var $val1 = $('.val1', this).val(); 
     var $val2 = $('.val2', this).val(); 
     var $val3 = $('.val3', this).val(); 
     var $val4 = $('.val4', this).val(); 

     var $total = ($val1 * 1) * ($val2 * 1); 
     var $cantidadestotales = ($val3 * 1) * ($val2 * 1); 
     var $preciostotales = ($val4 * 1) * ($val2 * 1); 

     mult += $total; 
     cantidadfinal += $cantidadestotales; 
     preciofinal += $preciostotales; 
     sum += parseFloat($val2); 
    }); 

    // Now we have the correct cantidadfinal and can update the values properly 
    $("tr.txtMult").each(function() { 
     var $val3 = $('.val3', this).val(); 
     cantidadesminimas = (8260 - cantidadfinal)/$val3; 
     cantidadesmaximas = (12390 - cantidadfinal)/$val3; 

     $('.val5', this).html(cantidadesminimas.toFixed(0)); 
     $('.val6', this).html(cantidadesmaximas.toFixed(0)); 
    }); 

    $("#precio").html(preciofinal.toFixed(0)); 
    $("#cantidadelegida").html(cantidadfinal.toFixed(0)); 
    $("#sum").html(sum.toFixed(0)); 
    $("#grandTotal").html(mult.toFixed(0)); 
    $("#cantidadmin").html(8260 - cantidadfinal.toFixed(0)); 
    $("#cantidadmax").html(12390 - cantidadfinal.toFixed(0)); 
    $("#kcaltotal").html(14000 - mult.toFixed(0)); 

} 

В следующий раз, когда я рекомендую вам использовать очень хороший яваскрипта плагин называется нокаут, он делает этот вид вещи очень легко и приятно.

Вы можете проверить результат в этом fiddle

Надеется, что это помогает.