2011-06-21 17 views
1

私は壁にぶつかっているので、これを達成する方法のアイデアを探しています。Javascript:sorting objects

私は、MySQLデータベースから取得したデータを表示するテーブルを持っています。この表は、表示されたデータの後に1つのセルの隠れた行が続く13個のセルの行のシーケンスになります。非表示行は、前の行のセルイ​​ンデックス1のリンクをクリックすると切り替わります。

行1:行2を表示するには、このセルをクリックします。別のセル:別のセル:広告nauseumを我々が13に到達するまで:行2を表示するには、このセルをクリックしてください: 行3に隠されている 行2:そうのように別のセル:別のセル:広告nauseum我々が13に到達するまで:ので、私はそれが表示された行だったかどうかを判断するためにテストを設定し、その後、すべての行を引っ張っjqueryのを使用して ...

を隠されている 行4隠し行、表示されている場合は、その行と次のオブジェクトをオブジェクトに入れて、そのオブジェクトを別のオブジェクトに配置します。

//this function is for sorting the data in the table 
$(".sort").click(function() { 

     //get what column we are sorting by 
     var sortBy = $(this).attr('sortBy'); 

     //set the colnum to sort by 
     if (sortBy == "itemname") { 
      var sortCol = 1; 
     } else if (sortBy == "priority") { 
      var sortCol = 2; 
     } else if (sortBy == "livedate") { 
      var sortCol = 10; 
     } else if (sortBy == "status") { 
      var sortCol = 11; 
     } else if (sortBy == "designer") { 
      var sortCol = 12; 
     } 

     //get the table data 
     var tableData = getTableData("NO", "null", "YES", sortBy); 

     //get all the rows 
     var tableRowArray = $("#productTableBody tr"); 

     //declare new table object 
     var tableObj = new Object; 
     var rowPackage = new Object; 

     //loop through tableRowArray and put rows into packages of two, the main row and the hidden row 
     for(var t=0; t<tableRowArray.length; t++) { 
      if($(tableRowArray[t]).children(":first").attr('class') == "colorCode") { 

       rowPackage[t] = $(tableRowArray[t]).children(); 
       rowPackage[t+1] = $(tableRowArray[t+1]).children(); 

       //dump rows into tableObj 
       tableObj[t] = rowPackage; 
      } 

      //clean out rowPackage 
      rowPackage = {}; 
     } 


     var x=-2; 
     for(thisRow in tableObj) { 
      x = x+2; 
      var sortItem = $(tableObj[thisRow][x][sortCol]).html(); 

          //ack! -->getting stumped here 

     }  
    }); 

また、ユーザーが並べ替える列を収集しました。私は、ユーザーが並べ替えたいセルを見つけることができます。私はその情報をプルする必要があることを知っている配列と並べ替えに入れますが、私はテーブルのボディのHTMLを書き換えることができるようにソートされた配列を私のtableObjに適用する方法を困惑していると思う...私は困惑しているたとえば、デザイナーがデータを並べ替えると、データがこのような{"a"、 "b"、 "c"、 "c"、 "a"、 "a"、 " "a"}はソートされたときにa、a、a、b、c、cになりますが、いくつかは同じなので、オブジェクトをループしてループして最初の項目に一致するエントリを見つけることはできません私のソートされたタフな1だ配列、4つの項目がそれにマッチします。それでは、どのよう私は、ソートされたリストの最初のAとアップ一致するオブジェクト内のどのエントリを判断しますか?事前に

感謝を。

答えて

1

が、私何もimpがないと仮定しますこの人生の中で痛い。

私は

var packs = []; 
// assuming you always have even number of tr's 
$("#productTableBody tr:odd").each(function(i, tr){ 
    packs.push({main: tr, sub: tr.next()}); 
    // tr.next() will be :even, so it's not yet selected 

    // now detach rows from the table 
    // note the order - next() wont work otherwise 
    tr.next().remove(); 
    tr.remove(); 
}); 

var sortedPacks = _(packs).sortBy(function(pack){ 
    return $(pack.main).find('td:nth('+sortCol')').text(); 
}); 

// now in sortedPacks you have touples of rows sorted by "main" rows sortCol column 
// and you would probably want to restore the table now 
$.each(packs, function(i, pack){ 
    $("#productTableBody").append(pack.main).append(pack.sub); 
}); 

Underscore libraryを使用して)このように行くだろうコードは完全にあなたの状況を反映していないかもしれないが、私はあなたがメインのアイデアを得ることができるはずと仮定します。

+0

FYI、これは正常な配列の並べ替えが正常に動作します。あなたはちょうど2つの異なる行からの細胞を比較する必要があります。 –

+0

ありがとう、私はあなたのコードを(悪い言葉を意図して並べ替える必要があります:D)と私の状況で動作するようになる... – PruitIgoe

0

あなたがここで求めているものを得るのは簡単ではありませんが、少なくともこれはソートされたデータを得ることを可能にします。

データを配列に収集することから始めて、たとえばdataのように、各行は配列またはオブジェクトのいずれかで表すことができます。

今、単純に今、あなたは簡単にソートされた配列に基づいて、テーブルを再構築することができます

data.sort(function(a, b){ 
    // select the two values from a and b depending on the column to sort by 
    a = a[colNr]; 
    b = b[colNr]; 
    return a == b ? 0 : a < b ? -1 : 1; 
}); 

を呼び出します。

データ収集中に配列/オブジェクトへの参照を追加した場合は、テーブルからすべての行を削除し、dataアレイをループして、各ノードをテーブルに追加することができます。

+0

引き出されたデータの配列をソートするのは問題ではなく、重複した値があるため、元の行に戻すことができます。 – PruitIgoe

+0

何が問題なのですか? DOMElementへの参照を配列/オブジェクトに簡単に追加するか、毎回テーブルを削除して再構築するだけです。 –