2016-04-06 19 views
0

私はajaxソースからデータを取得するデータテーブルを持っていますが、現在列4の降順で並べ替えられています。しかし、私は列として存在しないテーブルを注文したいデータの配列を持っています。データ型1.10データ配列による並べ替え

oTable = $('#Table').DataTable({ 
        "scrollX": true, 
        stateSave: false, 
        "processing": true, 
        "serverSide": false, 
        "ajax": "scripts/SSP_enquiry.php", 
        select: true, 
        colReorder: true, 
        "columnDefs": [ 
         { 
          "visible": false, 
          "searchable": false, 
          "targets": [9, 11, 12, 13, 14, 15, 16, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27] 
         }, 

         {className: "word", "targets": [1]} 


        ], 


        order: [4, 'desc'], 
        dom: '<"top">lrt<"bottom"pB><"clear">', 
        responsive: false, 
        buttons: [ 
         'excel' 
        ] 


       }); 

Moment.JSを使用してテーブル内の日付(4列目に存在する)と今日の日付との比較を行う私の機能です。その後、日数の差をdArrayという配列にプッシュします。

私の配列には、テーブル内の行に関連する各値のインデックスがあります。

だから、私は何をしたいdArray

function dateGet() { 

       var idx = oTable 
        .columns(4) 
        .data() 
        .eq(0);// Reduce the 2D array into a 1D array of data 
       //console.log(idx); 

       var dArray = []; 
       var today = moment(); 

       $.each(idx, function(index,value) { 
        var tempDate = moment(value); 
        var deadlineDiff = tempDate.diff(today, 'days'); 
        dArray.push(index,deadlineDiff); 
        console.log(dArray); 
       }) 
      } 

の値に基づいて、現在のテーブルをソートするdArray

[0, 6] 
[1, 0] 
[2, -0] 
[3, -0] 
[4, -1] 
[5, -6] 
[6, -7] 
[7, -7] 
[8, -11] 
[9, -12] 
[10, -12] 
[11, -12] 
[12, -13] 

UPDATE

のサンプルをインデックスと値を使用しています

既定値は0に設定されている新しい列を追加しました。値を割り当てる必要がありますデッドライン差の値の配列にsed。対応する行のIDと一致する必要があります。

result[j][0]は、アレイ result[j][1]でIDがこのような何かが、あなたは(あなたは差は関係なく仕事をしたいと仮定して必要なものを行う必要があり、配列

function dateGet() { 

      var dArray = []; 
      var today = moment(); 
      var ID = oTable 
       .columns(0) 
       .data() 
       .eq(0); 
      var dDate = oTable 
       .columns(4) 
       .data() 
       .eq(0);// Reduce the 2D array into a 1D array of data 


      $.each(dDate, function (index, value) { 

       var tempDate = moment(value); 
       var deadlineDiff = Math.abs(tempDate.diff(today, 'days')); 
       dArray.push(deadlineDiff); 

      }); 

      var result = $.map(ID, function (el, idx) { 
       return [[el, dArray[idx]]]; 
      }); 

      oTable.rows().every(function (rowIdx, tableLoop, rowLoop) { 
       var data = this.data(); 

       for (var j = 0; j < result.length; j++) { 

        if (data[0] == result[j][0]) { 
//in here the ID in the table and the ID in the array 
// match, I need to iterate through rows and assign the value 
//in the array to column 28's cell 
        } 


       } 


      }); 
     } 
+1

ちょうど提案として...列4のレンダリング機能では、日付を含むスパンにデータ属性を追加できますか?そしてそれを日付そのものではなく注文しますか? – annoyingmouse

+0

hmmmこれは、配列の値を対応する行/列インデックスに追加し、データ属性でソートすることを提案しているためです。私はそれをすることができるかどうか分かりませんが、あなたには例がありますか? –

+0

@annoyingmouseが正しいです。 'render()'メソッドが 'sort'または' filter'値を求めているときは、単に配列の値を返してください。 – davidkonrad

答えて

1

に私の差分値を与える私を与えるだろう負または正:

$(function() { 
    var example = $("#example").DataTable({ 
     columns: [{ 
      "title": "Released Date", 
      "type": "int-diff", 
      "render": function(d){ 
       var diff = Math.abs(moment().diff(moment(d, "DD/MM/YYYY"), 'days')); 
       return $("<span></span>",{ 
        "text": d + " (" + diff + ")", 
        "data-diff": diff 
       }).prop("outerHTML"); 
      } 
     }] 
    }); 
}); 

jQuery.extend(jQuery.fn.dataTableExt.oSort, { 
    "int-diff-pre": function(a) { 
     return ~~$(a).data("diff"); 
    }, 
    "int-diff-asc": function(a, b) { 
     return ((a < b) ? -1 : ((a > b) ? 1 : 0)); 
    }, 
    "int-diff-desc": function(a, b) { 
     return ((a < b) ? 1 : ((a > b) ? -1 : 0)); 
    } 
}); 

は、このような表があるとします:

<table id="example"> 
    <thead> 
     <tr> 
      <th>Date</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td>01/04/2016</td> 
     </tr> 
     <tr> 
      <td>02/04/2016</td> 
     </tr> 
     <tr> 
      <td>03/04/2016</td> 
     </tr> 
     <tr> 
      <td>04/04/2016</td> 
     </tr> 
     <tr> 
      <td>05/04/2016</td> 
     </tr> 
     <tr> 
      <td>06/04/2016</td> 
     </tr> 
     <tr> 
      <td>07/04/2016</td> 
     </tr> 
     <tr> 
      <td>08/04/2016</td> 
     </tr> 
     <tr> 
      <td>09/04/2016</td> 
     </tr> 
     <tr> 
      <td>10/04/2016</td> 
     </tr> 
     <tr> 
      <td>11/04/2016</td> 
     </tr> 
     <tr> 
      <td>12/04/2016</td> 
     </tr> 
     <tr> 
      <td>13/04/2016</td> 
     </tr> 
     <tr> 
      <td>14/04/2016</td> 
     </tr> 
    </tbody> 
</table> 

作業JSFiddle。基本的には、今日の日付とセルの日付の差を、スパンの正の整数として、データ属性としてスパンの内容の日付に置きます。次に、そのデータ属性を使用して、スパンの内容ではなくソートします。

希望に役立ちます。

+0

私はあなたがやったことを見ることができます、私はクラス/可視性などを設定するcolumnDefsを必要とするいくつかの28の列があります。私はdeadlineDateDifferenceと呼ばれる余分な列を持つように構造を少し変更しました。最初は0に設定されています。各行をループし、行IDが配列のIDと一致するかどうかを確認します。これで必要なのは、行と列28のデータを配列の値に変更する方法ですコード。 –

+0

優秀、それは助けてうれしいです。 – annoyingmouse

+0

私はあなたが私が提供した余分なコードを使って上記を達成する方法を知っているとは思いませんか?列がソート可能なように –