選択した値でテーブルを並べ替える

Question

私はオンラインのラグビーゲームを持っており、ユーザーが1つの列プレーヤー名だけのテーブルに表示されたページを作りたいと考えています。ドロップダウンリスト（スピード、キックなど）から何かを選択すると、プレイヤーはユーザーが選択したものに基づいてソートされます。ここ は、私が実行しようとしましたものです：

<script type="text/javascript"> 
var arr_head = ['name','age','ss','experience','leadership','weight','height','stamina','strength','breakthroughs','tackling,'handling','speed','kicking']; 
var arr_ord = ['asc','asc','desc','desc','desc','desc','desc','desc','desc','desc','desc','desc','desc','desc']; 
var arr_players = new Array(); 
var col = 0; 
// the array bellow is generated with a function: $arr_players = player_list($teamid); 
arr_players[0] = ['Bruce Ewing',20,151,2,3,84,182,21,22,21,23,24,23,17]; 
arr_players[1] = ['Barbu Frates',18,113,2,3,105,185,3,99,3,1,2,3,2]; 
arr_players[2] = ['Costi Buhaescu',24,116,2,1,95,198,2,99,2,3,4,4,2]; 
arr_players[3] = ['Corneliu Kirita',20,113,1,1,88,183,1,99,2,4,2,4,1]; 
arr_players[4] = ['Cristi Stelea',23,116,2,4,93,197,2,99,2,4,4,4,1]; 
arr_players[5] = ['Codrin Sarapatin',23,115,2,5,103,200,3,99,2,4,1,3,3]; 
arr_players[6] = ['Cosmin Tadici',19,113,1,5,99,203,2,99,2,1,2,4,3]; 
arr_players[7] = ['Dudu Dumea',21,115,1,5,87,179,2,99,3,3,2,4,2]; 
arr_players[8] = ['Dorian Hizo',24,115,1,4,98,195,4,99,3,2,1,3,3]; 
arr_players[9] = ['Ernest Cazacu',18,113,2,5,93,193,2,99,3,1,1,3,4]; 
arr_players[10] = ['Emil Siman',18,115,1,2,88,187,4,99,2,3,2,1,4]; 
arr_players[11] = ['Grigorie Banciu',20,116,2,5,102,198,3,99,2,4,2,4,2]; 
arr_players[12] = ['Horea Profis',19,112,2,5,104,185,3,99,2,2,3,1,2]; 
arr_players[13] = ['Iuliu Alexandrescu',19,112,1,4,99,174,3,99,1,2,4,1,2]; 
arr_players[14] = ['Ionut Halipa',20,117,2,4,87,171,2,99,4,4,2,1,5]; 
arr_players[15] = ['Ioan Ogasanu',20,120,1,5,85,198,4,99,4,4,3,3,3]; 
arr_players[16] = ['Larie Lozovan',19,115,1,5,102,180,3,99,4,4,2,1,2]; 
arr_players[17] = ['Mugur Buscan',20,114,1,3,93,192,2,99,1,2,2,3,5]; 
arr_players[18] = ['Nicusor Lucescu',22,113,2,4,94,193,4,99,2,2,2,3,1]; 
arr_players[19] = ['Olimpu Plesu',25,117,1,4,90,177,3,99,1,3,2,4,5]; 
arr_players[20] = ['Razvan Corlatean',23,112,1,1,92,194,1,99,2,3,4,1,2]; 
arr_players[21] = ['Sorin Halmageanu',21,115,1,4,101,193,2,99,2,2,2,3,5]; 
arr_players[22] = ['Sebi Ioanovici',21,116,1,3,104,179,2,99,4,3,2,3,3]; 
arr_players[23] = ['Titu Baldovin',25,113,2,2,100,185,2,99,3,3,2,2,2]; 
function sortMultiDimensional(a,b) { 
    if (arr_ord[col] == 'asc') 
     return ((a[col] < b[col]) ? -1 : ((a[col] > b[col]) ? 1 : 0)); 
    else 
     return ((a[col] > b[col]) ? -1 : ((a[col] < b[col]) ? 1 : 0)); 
} 
function sort_arr(crit) { 
    for (i=0; i<arr_head.length; i++) { 
     if (arr_head[i] == crit) { 
      col = i; 
      arr_players.sort(sortMultiDimensional); 
     } 
    } 
    var tbl = document.getElementById('players').getElementsByTagName('tr'); 
    for (i=0; i<arr_players.length; i++) { 
      linie = i + 2; 
      tbl[linie].getElementsByTagName('td')[1].innerHTML = arr_players[i][1]; 
    } 
} 
</script> 

<table id="players" border="0" width="100%"> 
    <tr> 
     <th style="text-align: center;"><?php echo $text['PLAYERS']; ?></th> 
    </tr> 
    <tr> 
     <td> 
      <select onchange="sort_arr(this.options[selectedIndex].value)"> 
       <option></option> 
       <option value="name"><?php echo $text['NAME']; ?></option> 
       <option value="age"><?php echo $text['AGE']; ?></option> 
       <option value="ss"><?php echo $text['SS']; ?></option> 
       <option value="experience"><?php echo $text['EXPERIENCE']; ?></option> 
       <option value="leadership"><?php echo $text['LEADERSHIP']; ?></option>    
       <option value="weight"><?php echo $text['WEIGHT']; ?></option>    
       <option value="height"><?php echo $text['HEIGHT']; ?></option>  
       <option value="stamina"><?php echo $text['STAMINA']; ?></option>     
       <option value="strength"><?php echo $text['STRENGTH']; ?></option>    
       <option value="breakthroughs"><?php echo $text['BREAKTHROUGHS']; ?></option> 
       <option value="tackling"><?php echo $text['TACKLING']; ?></option> 
       <option value="handling"><?php echo $text['HANDLING']; ?></option>    
       <option value="speed"><?php echo $text['SPEED']; ?></option> 
       <option value="kicking"><?php echo $text['KICKING']; ?></option> 
      </select> 
     </td> 
    </tr> 
    <tbody> 
     <?php for($i=0; $i<count($arr_players); $i++) { ?> 
      <tr><td><?php echo $arr_players[$i][1]; ?></td></tr> 
     <?php } ?> 
    </tbody> 
</table> 

しかし、それは動作しません。なにが問題ですか？

Answer 1

私は非常にjQueryプラグインのような既製溶液http://www.datatables.net/

Answer 2

をお勧めします[1]の下の行の元のバージョンから[0]（示すように）する必要があります。 javascript内の配列は0から始まり、最初の要素は1ではなく0になります。テーブル行には1つのセルしかないので、最初の（唯一の）ものが必要です。 2番目の要素（プレイヤー配列から要素を取得する）は、最初の要素（名前）も使用したいと思います。

tbl[linie].getElementsByTagName('td')[0].innerHTML = arr_players[i][0];

私はここフィドルに（可能な限り）、これを入れたときにこのエラーが簡単に見つかった。http://jsfiddle.net/TeAGw/5/

あなたは、このすべてをデバッグしようとしましたか？ブラウザが「動作しなかった」と報告したエラーメッセージを見ただけでは、このエラーの原因を即座に判断できたはずです。 3つの主要なWebブラウザすべてに統合されたデバッグツールが用意されています。