- ベストアンサー
ホームページビルダーを使用して商品一覧表を作成する際の順番並び替え方法についての質問
- 初心者の方がホームページビルダーを使用して商品一覧表を作成し、特定の項目をクリックしたらその項目で並び替える方法についてわからないので、教えてください。
- 商品一覧表は現在商品番号順に並んでいるが、価格順に並び替える方法がわからない。プログラムの知識がないため、どのようにすればいいかわからない。
- ホームページビルダーで作成した商品一覧表の項目並び順を変更する方法について教えてください。特に価格順に並び替える方法が知りたい。
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
とりあえず、javascriptで作ってみました。 表のデータは、表のまま、スクリプトと対応さえ合わせばいいです。 ---------------------------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=SHIFT_JIS"> <title>価格でソート</title> <script type="text/javascript"> <!-- function sort(key, seq, kind){ //key:ソートに使う列番号、０始まり //seq:L or S 、大きい順か小さい順かを示す //kind:N or S、数字か文字かを示す //バブルソート var TB=document.getElementById('TB'); var rowsLen=TB.rows.length; var x, y; for(var i=0;i<rowsLen-1;i++){ for(var j=i+1;j<rowsLen;j++){ if(kind=='N'){ x=parseInt(TB.rows[i].cells[key].innerHTML); y=parseInt(TB.rows[j].cells[key].innerHTML); } else { x=TB.rows[i].cells[key].innerHTML; y=TB.rows[j].cells[key].innerHTML; } if(seq=='L'){ if(x < y) swapRow(i, j); } else { if(x > y) swapRow(i, j); } } } } function swapRow(r1, r2){//r 位置は、０始まり,r1<r2 var TB=document.getElementById('TB'); var colsLen=TB.rows[0].cells.length; var newTR; var newTD; newTR = TB.insertRow(r1); for(var i=0;i<colsLen;i++){ newTD = newTR.insertCell(i); newTD.innerHTML = "" + TB.rows[r2+1].cells[i].innerHTML; TB.rows[r2+1].cells[i].innerHTML=TB.rows[r1+1].cells[i].innerHTML } TB.deleteRow(r1+1); } //--> </script> </head> <body> <table border=1> <col align="left"><col align="center"><col align="left"><col span="4" col align="center"> <thead> <tr> <th onclick="sort(0, 'S', 'S')">商品番号</th> <th>商品名</th> <th onclick="sort(2, 'L', 'N')">価格</th> <th>色</th> <th>サイズ</th> <th onclick="sort(5, 'L', 'N')">在庫</th> <th>備考</th> </tr> </thead> <tbody id="TB"> <tr> <td>11BKL</td> <td>ハンドバッグ</td> <td>5500</td> <td>黒</td> <td>大</td> <td>20</td> <td>なし</td> </tr> <tr> <td>12BKM</td> <td>ハンドバッグ</td> <td>5000</td> <td>黒</td> <td>中</td> <td>40</td> <td>なし</td> </tr> <tr> <td>13BKS</td> <td>ハンドバッグ</td> <td>4800</td> <td>黒</td> <td>小</td> <td>15</td> <td>なし</td> </tr> <tr> <td>22BLM</td> <td>ハンドバッグ</td> <td>5000</td> <td>青</td> <td>中</td> <td>50</td> <td>人気商品！</td> </tr> </tbody> </table> </body> </html>
お礼
わぁ！ すご～い！！ わざわざ作っていただいたんですか？ どうもありがとうございます。<(_ _*)> これを自分のサイトの表示に合わせて文字を打ち変えて使えばいいんですね。 早速やってみます。 また、もしつっかえたら補足します。 そのときはよろしくお願いいたします^^
補足
ありがとうございました。 できました。 大変お世話になりました。 お礼と補足が反対になっちゃってスミマセン。