アプリ版：「スタンプのみでお礼する」機能のリリースについて

クリックしたら順番に並び替わるようにするには

解決済

  • 質問者：chiko0000
  • 質問日時：
  • 回答数：1件

初心者です。
ホームページビルダーでサイトを作り、商品一覧表を載せています。
左から、商品番号・商品名・価格・・・と7項目ほどあって、現在は商品番号順に並んでいます。
これを、「価格」をクリックしたら価格順に並び替わるようにしたいのですが、どうすればいいでしょうか。
CGIでできると聞いたのですが、プログラムの知識はありません。
今の表のままでできるのか、データはどこにおけばいいのか、そういったこともわかりません。
「asp」でできると聞いたこともあるんですが、なんのことかわかりません。
検索してもわかりませんでした。
なにもわからなくて申し訳ありませんが、よろしくお願いいたします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (1件)

No.1ベストアンサー

  • 回答者： BLUEPIXY
  • 回答日時：

とりあえず、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>

この回答への補足

ありがとうございました。
できました。
大変お世話になりました。
お礼と補足が反対になっちゃってスミマセン。

補足日時：2005/12/06 19:51
通報する
    • good
    • 0
    • 件
通報する
この回答へのお礼

わぁ！
すご～い！！
わざわざ作っていただいたんですか？
どうもありがとうございます。<(_ _*)>

これを自分のサイトの表示に合わせて文字を打ち変えて使えばいいんですね。
早速やってみます。
また、もしつっかえたら補足します。
そのときはよろしくお願いいたします^^

通報する
お礼日時：2005/12/04 23:05

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報