1

この jquery データテーブルプラグインを使用して、データベースからの情報を表示しています。私のテーブルは次のようになります。今、私は点数を合計しようとしています (下の表を確認してください)

<script type="text/javascript" src="js/jquery.dataTables.min.js"></script>
<script type="text/javascript" charset="utf-8">
 $(document).ready(function() {$('#gtable').dataTable();} );
  </script>

<table class="gtable" align="center" id="gtable">
<thead>
 <tr>
    <th>Sl</th>
    <th>Name</th>
    <th>Marks</th>
 </tr>
</thead>

<tbody>
 <tr><td>1</td> <td>Charlie Sheen</td>  <td>20</td></tr>
 <tr><td>2</td> <td>John Cryer</td>     <td>20</td></tr>
 <tr><td>3</td> <td>Jason Stathum</td>  <td>20</td></tr>

</tbody>

</table

プラグインの Web サイトでは、合計を実行して表示する次のコードが提供されていますが、上記のデータ テーブルの使用方法はまだわかりません。

これで私を助けてもらえますか?

  $(document).ready(function() {
  $('#example').dataTable( {
    "fnFooterCallback": function ( nRow, aaData, iStart, iEnd, aiDisplay ) {
        /*
         * Calculate the total market share for all browsers in 
          this table (ie inc. outside
         * the pagination)
         */
        var iTotalMarket = 0;
        for ( var i=0 ; i<aaData.length ; i++ )
        {
            iTotalMarket += aaData[i][4]*1;
        }

         /* Calculate the market share for browsers on this page */
        var iPageMarket = 0;
        for ( var i=iStart ; i<iEnd ; i++ )
        {
            iPageMarket += aaData[ aiDisplay[i] ][4]*1;
        }

        /* Modify the footer row to match what we want */
        var nCells = nRow.getElementsByTagName('th');
        nCells[1].innerHTML = parseInt(iPageMarket * 100)/100 +
            '% ('+ parseInt(iTotalMarket * 100)/100 +'% total)';
     }
   } );
  } );
4

2 に答える 2

2

関数はこのようにする必要があります

$('#example').dataTable( {
  "fnFooterCallback": function ( nRow, aaData, iStart, iEnd, aiDisplay ) {

    var TotalMarks = 0;
    for ( var i=0 ; i<aaData.length ; i++ )
    {
        TotalMarks += aaData[i][2]*1;
    }

    var nCells = nRow.getElementsByTagName('th');
    nCells[1].innerHTML = TotalMarks;
  }
});

これが役立つことを願っています。

于 2012-09-02T08:20:02.923 に答える
1

非常に簡単です:

var sum = 0;
$("#gtable tbody tr").each(function(){
    sum += $(this).find("td").eq(3).text();
});

テストされていません。問題がある場合は教えてください。

説明: ここで基本的に行われているのは、変数 'sum' を のスコープ外で初期化する$.eachことです。jQuery では、条件に一致するすべての要素 (この場合は #gtable に属するテーブル本体のすべてのテーブル行) を反復処理できます。よりも、各行で 3 番目の td を見つけて合計に追加します。これは、JavaScript が動的に型付けされる言語であるためです。そうすることが可能です。

変数「合計」には、すべてのマークの合計があります。

于 2012-09-02T08:22:53.643 に答える