
フォームからGETで複数のパラメータを送信するとき、値が空文字のものを表示しないようにすることは可能でしょうか。
たとえば、次のようなフォームを含むform.phpがあるとします。
--------------
<form action="./result.php" method="get">
<input type="text" name="id" size="40">
<input type="text" name="name" size="40">
<input type="text" name="address" size="40">
<input type="text" name="sex" size="40">
<input type="submit" value="送信"><input type="reset" value="リセット">
</form>
--------------
このフォームから、
--------------
id:13
name:佐藤太郎
address:東京都新宿区適当1-2-3
sex:男性
--------------
というデータを送信した場合、送信ボタンを押すと
./result.php?id=13&name=佐藤太郎&address=東京都新宿区適当1-2-3&sex=男性
のページに遷移しますが、
--------------
id:
name:佐藤太郎
address:
sex:男性
--------------
ですと
./result.php?id=&name=佐藤太郎&address=&sex=男性
になります。
このままですとクエリが読みにくいので、
--------------
id:
name:佐藤太郎
address:
sex:男性
--------------
の場合は
./result.php?name=佐藤太郎&sex=男性
と入力値のあるものだけを表示してそれ以外は消去したいです。
というのも、例としたform.phpではパラメータは4つでしたが、現在作成しているフォームではパラメータが21あり、空文字のものも含むと、遷移後の画面のURLがとても見にくいのです。
このようにパラメータを見やすくするようなjavascriptのコードを教えてください。
jQueryは1.7を使用しています。どうかよろしくお願いいたします。
No.1ベストアンサー
- 回答日時:
onsubmitで入力チェックを行い、未入力があるときは当該要素をdisabledにする
ただし戻るなどしたときにdisabledになったままが気になるなら
onloadなどでdisabledをfalseにしてやる必要があるかも
No.2
- 回答日時:
A No1様の回答とほとんど同じですが、
onsubmitで入力チェックを行い、スクリプト内でクエリ文字列を作成。
そのまま、スクリプトからリクエストを送信する。
DOMを変更しないので、「戻る」などを気にしなくてもよいかも…
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- PHP 入力した部分を表示させたまま(保持)するにはどうすれば良いでしょうか? 1 2023/01/25 11:14
- JavaScript Javascriptが機能せず原因が分からないので教えて頂きたいです 3 2023/06/04 14:50
- PHP PHPで画像の渡しが上手く行きません。 1 2023/02/02 09:39
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
- PHP PHP MySql 画像を取得 1 2022/06/04 14:05
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- HTML・CSS 私の能力からして間違っていないような気がします。 4 2022/09/30 13:24
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
iframe内のnameへ移動し、そこ...
-
name属性とid属性の違い。DOMの...
-
動的にTabindexの値を変えたい!
-
【jQuery】input nameの文字列...
-
JavaScriptにて動的に配列を作...
-
入力フォームに半角スペース以...
-
二つの入力欄に、同時に同じ文...
-
新しくフォルダを作成したい
-
Javascriptでのbuttonのname属...
-
return trueとreturn falseの用...
-
slickのレスポンシブ > center...
-
セレクトを全て選択されていな...
-
tableの任意行にfocusをあてる
-
大文字か小文字かを判断する方法
-
function名の変更はできますか?
-
ラジオボタンにタブインデック...
-
【jsp/Java】チェックボックス...
-
Java Scriptで・・・
-
セレクトメニューの値の取得
-
Selectの中身をfor文で入れる
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
【jQuery】input nameの文字列...
-
新しくフォルダを作成したい
-
二つの入力欄に、同時に同じ文...
-
ラジオボタンでクリックした値...
-
テキストボックスの値同士を比...
-
動的にTabindexの値を変えたい!
-
jquery.validate.jsについて
-
Javascriptでのbuttonのname属...
-
複数のテキストフィールドを同...
-
ファイル選択ダイアログが表示...
-
JavaScriptにて動的に配列を作...
-
name属性のないformタグの、中...
-
ボタンを押すとテキストボック...
-
jqueryでtextareaのcols、rows...
-
テキストエリアをenterキーでフ...
-
ASP.NETでNAME属性を固定にしたい
-
submitボタン押下時にPOSTされ...
-
時間の比較は可能でしょうか?
-
出発駅A、到着駅Bを選択すると...
-
ひ孫に当たるiframe から親ウイ...
おすすめ情報