djangoがJavaScriptで表の値を生成しました

Question

私は、以下のループのためのdjangoのための表があります。 asset.by_item_weightカラムの合計を合計/追加するためのJavaScriptをいくつか追加しました。

何らかの理由で、私はtotalCol tdで返された値を取得しません。

JSタグの値が、JSが実行される前にtdにロードされることを期待して、この.htmlの最後にscriptタグを入れました。

私はこれが間違ったやり方であるとか、この<script>がどこにあるべきかを知っているかもしれません。

私は、差をつけなかった最後のbodyタグの前にpersonal/header.htmlにscriptタグを入れようとしました。

ご協力いただければ幸いです。あなたが1つしかないながら

{% extends "personal/header.html" %} 


{% block content %} 

<h1 class='text-center'>This is the full asset list not split by owner</h1></br> 




    <table id="sum_table" class="well table table-striped text-center"> 
     <thead> 
      <tr class="text-center titlerow"> 
       <td class="text-center">Asset ID:</td> 
       <td class="text-center">Asset Name:</td> 
       <td class="text-center">Asset Quantity:</td> 
       <td class="text-center">Asset Weight/kg:</td> 
       <td class="text-center">Total Weight/kg:</td> 
       <td class="text-center">Asset Owner:</td> 
      </tr> 
     </thead> 
     <tbody> 
      <tr class="text-center"> 

    {% for asset in object_list %} 
       <td><a href="/sam/assets/{{ asset.id }}">{{ asset.id }}</></td> 
       <td>{{ asset.asset_name }}</td> 
       <td>{{ asset.asset_quantity }}</td> 
       <td>{{ asset.asset_weight }}</td> 
       <td class="rowDataSd">{{ asset.by_item_weight }}</td> 
       <td><a href="/sam/owners/">{{ asset.asset_owner }}</></td> 

      </tr> 
    {% endfor %} 

      <tr class="totalColumn"> 
       <td class=""></td> 
       <td class=""></td> 
       <td class=""></td> 
       <td class=""></td> 
       <td class="totalCol">Total:</td> 
       <td class=""></td> 
      </tr> 
     </tbody> 
    </table> 

<p class="text-center">{% include "sam/includes/backtosam.html" %}</p> 



{% endblock %} 
<script> 
     var totals=[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]; 
     $(document).ready(function(){ 

      var $dataRows=$("#sum_table tr:not('.totalColumn, .titlerow')"); 

      $dataRows.each(function() { 
       $(this).find('.rowDataSd').each(function(i){   
        totals[i]+=parseInt($(this).html()); 
       }); 
      }); 
      $("#sum_table td.totalCol").each(function(i){ 
       $(this).html("total:"+totals[i]); 
      }); 

     }); 
</script> 

Answer 1

• はなぜ#sum_table td.totalColを反復処理するのですか？
• なぜアレイに一杯のゼロがプレフィックスされていますか？
• なぜアレイを使用するのですか？

  var total = 0; 
  $('#sum_table tr td.rowDataSd').each(function() { 
      total += parseInt($(this).text()); 
  }); 
  $('#sum_table td.totalCol').text("total: " + total); 
  

  • をダニエルローズマンが言ったように、なぜあなたはJSでこれをやっている：

  あなたのコードではなく、次のようになりますか？