添加从数据库填充的动态行中给出的值的总和

时间:2016-03-16 06:24:43

标签: php jquery html sqlsrv dynamic-tables

我有一个动态表,其中列A是从数据库动态填充的,一列是评级的输入字段。代码位于以下链接中:

Click here to view the code

  

PHP代码

<?PHP 
    $myquery=" select ROW_NUMBER,Weightage FROM Appraisal_Objectives WHERE Serial_Number like '%1152' ORDER BY Row_Number asc";
    $fetched=sqlsrv_query($conn,$myquery) ; 
    if( $fetched === false ) { die( print_r( sqlsrv_errors(), true ));}
    while($res=sqlsrv_fetch_array($fetched,SQLSRV_FETCH_ASSOC))
    {
        $Weightage=$res['Weightage'];
        $Row_Number=$res['ROW_NUMBER'];                                 
        if($Weightage=='==')
        {
            echo "<tr><td><b>Sub-Total</td></b>";
            echo "<td><b><input type='number' class='form-control' value='70'></td></td></b>";
            echo "<td><input type='number' name='SubTotals[]' id='SubTotals' class='SubTotals form-control' readonly onchange='calculateGrandTotal(this);'></td></tr>";         
        }
        else
        {
            echo "<tr><td> </td>";
            echo "<td>".$Weightage."</td>";
            echo "<td><input type='number' name='Rating[]' id='Rating' class='Rating form-control' onkeypress='return isNumberKey(event)' onChange='calc(this.parentElement.parentElement);calculateSubTotal(this);'></td>";
            echo "<td style='display:none'><input type='number' name='max_rating[]' id='max_rating' class='max_rating form-control' onChange='calc(this.parentElement.parentElement));' value='$Weightage' td>";
            echo "<td style='display:none'><input type='number' name='Row_Number[]' id='Row_Number' class='Row_Number form-control' value='$Row_Number' td></tr>";
        }
    }
?>

我想做什么:

所有数据元素都应该相加,并在字段顶部的Sub-Total字段中给出小计。 然后小计总数应加起来并给出总计。我附上了一张照片,以便更好地理解。

enter image description here

我的问题:

当我输入值而不是去各自的小计时,它们会加在一起。我哪里出错了?感谢任何建议..

注意:字段是动态的,可以根据数据库值更改行号。需要根据动态字段进行计算,而不是我在代码中提供的静态字段。

1 个答案:

答案 0 :(得分:0)

抱歉延误。的 http://plnkr.co/edit/MbHyTefvZ9kHENJmNcVi?p=preview

虽然很接近,但我不喜欢你是怎么做的...... 考虑一下这样的解决方案 - 它只需要通过直到遇到某些东西 - 所以会以你想要的方式对待动态的东西:

$(document).ready(function(){
    function updateTotals(ctrl){
      var total = parseInt(ctrl.val());

      ctrl.parents('tr').prevAll("tr").each(function(ind,val){
        if($(val).find('.SubTotals').length > 0)
          return false;
        else
        {
          var num = $.trim($(val).find('.Rating').val())== "" ? 0 : $(this).find('.Rating').val();;
          total += parseInt(num);
        }
      });
      ctrl.parents('tr').nextAll("tr").each(function(ind,val){
        if($(val).find('.SubTotals').length > 0)
          return false;
        else
        {
          var num = $.trim($(val).find('.Rating').val())== "" ? 0 : $(this).find('.Rating').val();;
          total += parseInt(num);
        }
      });
      ctrl.findNext('.SubTotals').val(total);


    var gTotal = 0;
    $('.Rating').each(function() {
        gTotal += Number($(this).val());
    });
    $('#Grand_Total').val(gTotal);
    }

      $('#tb input').on( "change", function(){
        updateTotals($(this));
      });

    });

    (function( $ ){
   $.fn.findNext = function(sel) {
     var $result = $(sel).first();
     if ($result.length <= 0) {
       return $result;
     }
     $result = [];
     var thisIndex = $('*').index($(this));
     var selIndex = Number.MAX_VALUE;
     $(sel).each(function(i,val){
       var valIndex = $('*').index($(val));
       if (thisIndex < valIndex && valIndex < selIndex) {
         selIndex = valIndex;
         $result = $(val);
       }
     });
     return $result;
   }; 
  })( jQuery );

我从你的输入框中删除了这些事件 - 而且,你到处都有重复的ID ...尽量避免这种情况。