計算

2016-12-13 10 views
3

現金OPNAMEフォーム計算

<form action="" id="frm_cash_opname" name="frm_cash_opname" method="POST" class="form-horizontal"> 

    <div class="form-group"> 
     <div class="col-sm-1 col-sm-offset-1 text-left">KERTAS</div>        
     <div class="col-sm-2 text-right">100,000</div>       
     <div class="col-sm-2"> 
      <input type="text" id="J1" name="J1" data-nilai="100000" class="form-control number" dir="rtl"> 
     </div> 
     <div class="col-sm-2"> 
      <input type="text" id="T1" name="T1" value="0" class="form-control number" dir="rtl"> 
     </div> 
    </div> 

    <div class="form-group"> 
     <div class="col-sm-1 col-sm-offset-1 text-left">KERTAS</div>        
     <div class="col-sm-2 text-right">50,000</div>       
     <div class="col-sm-2"> 
      <input type="text" id="J2" name="J2" data-nilai="50000" class="form-control number" dir="rtl"> 
     </div> 
     <div class="col-sm-2"> 
      <input type="text" id="T2" name="T2" value="0" class="form-control number" dir="rtl"> 
     </div> 
    </div> 

    <div class="form-group"> 
     <div class="col-sm-1 col-sm-offset-1 text-left"><b>TOTAL</b></div>       
     <div class="col-sm-2 text-right"></div>       
     <div class="col-sm-2 text-right"></div>       
     <div class="col-sm-2 text-right"> 
      <input type="text" id="TOTAL" name="TOTAL" class="form-control number" dir="rtl" readonly="readonly"> 
     </div>       
    </div> 

</form> 

私はこの要件に基づいて計算をしたい:各サブ合計で

sub_total = $("input[name^='J']") * data-nilai) 

と出力、IDで識別されます。

$("input[name^='T']") 

そしてまた、すべての行のすべての合計、総合計の計算:

$("input[name^='T']")) 

そして、中出力、それを:

$('#calc').click(function(){ 
    var total = 0; 

    $('form').find(".form-group:not(:last)").each(function(){ 
     var j_field = parseInt($("input[name^='J']", this).val()); 
     var j_field_nilai = parseInt($("input[name^='J']", this).data('nilai')); 
     var sub_total = j_field*j_field_nilai; 

     $("input[name^='T']", this).val(sub_total); 
     total+= sub_total; 
    }) 

    $("input[name='TOTAL']").val(total); 
}) 

は、この情報がお役に立てば幸い:

​​

事前のおかげで、悪い英語

+1

だからここでの質問はありますか? – Sojtin

+0

ごめんなさい。私はすべての行に各小計($( "#input [name^= 'J'])を出力したいと思います。また最後のdiv($( "#TOTAL"))の合計を自動的に更新します –

答えて

1

のため申し訳ありませんあなたはeach()メソッドを使用することができます。

$('#calc').click(function(){ 
 
    var total = 0; 
 

 
    $('form').find(".form-group:not(:last)").each(function(){ 
 
    var j_field = parseInt($("input[name^='J']", this).val()); 
 
    var j_field_nilai = parseInt($("input[name^='J']", this).data('nilai')); 
 
    var sub_total = j_field*j_field_nilai; 
 
    
 
    $("input[name^='T']", this).val(sub_total); 
 
    total+= sub_total; 
 
    }) 
 

 
    $("input[name='TOTAL']").val(total); 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form action="" id="frm_cash_opname" name="frm_cash_opname" method="POST" class="form-horizontal"> 
 

 
    <div class="form-group"> 
 
     <div class="col-sm-1 col-sm-offset-1 text-left">KERTAS</div>        
 
     <div class="col-sm-2 text-right">100,000</div>       
 
     <div class="col-sm-2"> 
 
      <input type="text" id="J1" name="J1" data-nilai="100000" class="form-control number" dir="rtl"> 
 
     </div> 
 
     <div class="col-sm-2"> 
 
      <input type="text" id="T1" name="T1" value="0" class="form-control number" dir="rtl"> 
 
     </div> 
 
    </div> 
 

 
    <div class="form-group"> 
 
     <div class="col-sm-1 col-sm-offset-1 text-left">KERTAS</div>        
 
     <div class="col-sm-2 text-right">50,000</div>       
 
     <div class="col-sm-2"> 
 
      <input type="text" id="J2" name="J2" data-nilai="50000" class="form-control number" dir="rtl"> 
 
     </div> 
 
     <div class="col-sm-2"> 
 
      <input type="text" id="T2" name="T2" value="0" class="form-control number" dir="rtl"> 
 
     </div> 
 
    </div> 
 

 
    <div class="form-group"> 
 
     <div class="col-sm-1 col-sm-offset-1 text-left"><b>TOTAL</b></div>       
 
     <div class="col-sm-2 text-right"></div>       
 
     <div class="col-sm-2 text-right"></div>       
 
     <div class="col-sm-2 text-right"> 
 
      <input type="text" id="TOTAL" name="TOTAL" class="form-control number" dir="rtl" readonly="readonly"> 
 
     </div>       
 
    </div> 
 

 
</form> 
 

 
<button id='calc'>Calculate</button>

+0

ありがとうございます。それは素晴らしい作品です!私は合計を得ることができなかったことを除いて。 '私はconsole.log(合計)を試してみます。結果はNaN' –

+0

ようこそ、私の側でうまくいくhttp://recordit.co/iD3uSy0Afw –

+0

私の更新を確認してください。 –