- ベストアンサー
JavaScriptでテーブルのソートを実行した結果でフォーム送信
- JavaScriptでテーブルのソートを実行し、フォーム送信の結果を取得する方法を紹介します。
- IE6では正常に動作するが、FireFoxではパラメータを取得できない問題が発生しています。
- tablesort.jsを改良して、全てのブラウザで正常に動作するようにする方法を考えています。
- みんなの回答 (8)
- 専門家の回答
質問者が選んだベストアンサー
#4,#6です。 前回書いたように、Firefoxでソートのスクリプトを組み込み、実行しても値が送信される事は確認済みです。(間違ったhtmlの状態でソートを実行すると送信されない現象も確認してます) あと思いつくのは他のJavascriptの競合/干渉、 まだ他にHTML的におかしな部分がある、とかです。 他のJavascriptを利用しているかわかりませんが、 とりあえず、htmlの妥当性でもチェックしてみては? http://openlab.ring.gr.jp/k16/htmllint/htmllint.html
その他の回答 (7)
- STICKY2006
- ベストアンサー率29% (1536/5269)
こんちくは。 >>質問に書いたソース例は例なので まぁ、その気があるなら、例でもなんでも、もんのすんごく簡単なソース書いて試してみればいいんすよ。 テーブル2行、フォームでかこって、テーブルソート機能くっつけて。。。 それで試す。 まずは、「どこに原因があるかの『切り分け作業』」が肝心かと思います。 自分だったら、「まずは、テーブルソートのJavaScriptファイル外した状態で正常に動くんですか??」って書いたので、 JavaScriptファイルを外した状態、外さなかった状態で試して、違いが出るなら、JavaScriptファイルをまず疑いますが。 >>FireFoxでは正常に動作してくれないのです >>(並び替えを1度もしなければ正常です) これを素直に受け取っていいのならば、そのJavaScriptファイルでしょ。。。という感じではありますが。。。 ソートの際に使われてるJavaScript内の関数で、FireFoxに対応してないもの等あったりはしないもんですかね? 結構、ブラウザによってJavaScriptの対応も違いますからねぇ。。。(汗 ソートしなきゃ思い通りに動く。 なら、ソートした際に通るソース部分をまず疑うべきかと個人的には思いました。
- steel_gray
- ベストアンサー率66% (1052/1578)
#4です。修正して試したとの事ですが、SUBMITの位置は? <form> <table> ・・・・ </table> <input type="submit" value=" 動作 "> ←(1)ここら辺が妥当 </form> <input type="submit" value=" 動作 "> ←(2)フォームの外にsubmitボタンを置いているのだとしたらフォームの内容は送信されない。 (1)のようにしてソート後、値がブラウザから送信される事は確認しました
補足
もちろん(1)です (2)だと<form>の外に出ちゃってますんで それはないです。
- 神崎 渉瑠(@taloo)
- ベストアンサー率44% (1016/2280)
> FireFoxではパラメータを取得することができません パラメータを取得するのは、どこが取得するのですか? サーバーの<form>の値? サーバーのスクリプトのどこかの関数? Firefoxの何の関数? 何をする関数? 呼び出し方法は? > (並び替えを1度もしなければ正常です) とのことですから、送信そのものではなく、テーブルのソートに問題があるのでは? それから、 <input>の順番を変えたところで、送信する順番は不定です。 (HTMLでも、送信する順番を規定していません) ほとんどのブラウザで、inputの順番どおりに送信しますが、 <form method="get"> <input type="text" name="t1" value="value1"> <input type="text" name="t1" value="value2"> <input type="hidden" name="id" value="user123"> <input type="submit" value="send"> </form> こういうHTMLを ?id=user123&t1=value1&t1=value2 ?t1=value2&t1=value1&id=user123 <input>の最初から並べても、後ろから並べても、どちらでもかまいません。 並べ替えが必要な場合は、サーバー側で適切な処理を施す必要があります。 > ANo.2~4 文法上はどうあれ、<tbody>や<table>と<form>の位置関係をどの様に書いても 実装上は、<form>の中に<input>が入っていれば、そのvalueは送信されます。 (HTMLの文法でも、<form>の中に入っている<input>を送信する、となっていて、<table>との位置関係までは言及されていません) >punipunipunikoさんへ 実装上は問題がなくても、 デファクトスタンダード(広く使われているブラウザに合わせる)ではなく、デジューレスタンダード((この場合は)W3Cが定義したHTML)に合わせるほうが良いと思います。 デファクトスタンダードは、IE以外は、その規格、仕様が出されていないことが多く、 バグなのか正常な動作なのかがわかりにくいことがあります。
補足
パラメータを取得するのはaaa.aspです <form>のaction先です。 ><input>の順番を変えたところで、送信する順番は不定です この並び替えを必要としてるのではありません あくまで、画面上で見た目並び変わっていたらいいだけです。 >デジューレスタンダード((この場合は)W3Cが定義したHTML) 一度、仕様を考えなおしてみたいと思います
- steel_gray
- ベストアンサー率66% (1052/1578)
文法的にtbody直下にはtrしか置けない事になっています。 また開始タグと終了タグは正しく入れ子構造にする必要があります。 なので、tableの前にformを置くのが妥当になります。 javascriptの中身は見てませんが たまたまソートしていない時に問題がなくても スクリプトで操作した結果、予期しない動作になってもしかたがありません。 まずはform,/formの位置を直して試してみては。
補足
<form>を<table>の外に出しました <form> <table> ・・・・ </table> </form> でも駄目でした
- arexis
- ベストアンサー率66% (66/99)
あれ? 送れますねw #2は無視で^^;
- arexis
- ベストアンサー率66% (66/99)
</THEAD> <TBODY> <form name="userlist" method="POST" action="aaa.asp"> こうなっているとFORMタグはテーブルを内包する状態と言えない。 </THEAD> <form name="userlist" method="get" action="1.html"> <TBODY> せめてこうすればTBODYを内包するので送信可能なはず。
- STICKY2006
- ベストアンサー率29% (1536/5269)
>>どのブラウザでも正常に動作するようにするには そこらへんは結構面倒なはずなのでとりあえずスルー。 あれですよ。 まずは、テーブルソートのJavaScriptファイル外した状態で正常に動くんですか?? <form>~</form> と<submit>だけあれば、とりあえず、「aaa.asp」で情報取得は可能かと思いますが。。。 その状態でもFirefox側で動きませんかね?
補足
質問に書いたソース例は例なので 正常かは不明ですが 実際にはちゃんと動いています (パラメータを取れている) 情報が多くなってきたので テーブルの並び替え機能を追加したかったんですが FireFoxでは正常に動作してくれないのです (並び替えを1度もしなければ正常です)
お礼
回答ありがとうございました 実際に使用しているHTMLを検証して 正常に動くようになりました