[解決済み] [Solved] How to ensure a <select> form field is submitted when it is disabled?
2022-04-19 11:38:06
Question
私は
select
フォームフィールドを "readonly"としてマークしたいのですが、ユーザーが値を変更できないようにするためです。 この場合
disabled
属性は、ユーザーが値を変更することを防ぎますが、フォームと一緒に値を送信しません。
は
readonly
属性は
input
と
textarea
というフィールドがありますが、基本的にはそのようにしたいのです。 これを動作させる方法はあるのでしょうか?
私が考えているのは、以下の2つの可能性です。
-
を無効化する代わりに
select
をすべて無効にします。option
を選択し、CSSでグレーアウトさせることで、無効化されているように見える。 - 送信ボタンにクリックイベントハンドラを追加し、フォームを送信する前に、無効になっているすべてのドロップダウンメニューを有効にするようにします。
解決するには?
<select disabled="disabled">
....
</select>
<input type="hidden" name="select_name" value="selected value" />
ここで
select_name
は、通常
<select>
.
もう一つの選択肢
<select name="myselect" disabled="disabled">
<option value="myselectedvalue" selected="selected">My Value</option>
....
</select>
<input type="hidden" name="myselect" value="myselectedvalue" />
さて、この件ですが、使っているウェブサーバーによっては、このように
hidden
の前、あるいは後に入力します。
<select>
.
私の記憶が正しければ、IISの場合は前に、Apacheの場合は後に記述します。いつものように、テストが重要です。
関連
-
vueはopenlayersを使用してスカイマップとガオードマップをロードする
-
Vueのイベント処理とイベントモディファイアの解説
-
[解決済み] Webフォームのフィールド/入力タグでブラウザのオートコンプリートを無効にするにはどうすればよいですか?
-
[解決済み] リスト項目にマウスを置いたときに、カーソルを手の形に変えるには?
-
[解決済み] Node.jsを使うタイミングをどう判断するか?
-
[解決済み] セレクトボックスのプレースホルダーを作成するにはどうすればよいですか?
-
[解決済み] How can I set the default value for an HTML <select> element?
-
[解決済み] How do I style a <select> dropdown with only CSS?
-
[解決済み] セレクトボックスのオプションをすべて削除してから、オプションを1つ追加して、jQueryで選択するにはどうすればよいですか?
-
[解決済み] HTMLのチェックボックスのchecked属性の適切な値は何ですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Vue Element-uiは、アイコンを追加するためのツリーコントロールノードを詳細に実装しています。
-
vueネットワークリクエストソリューション ネイティブネットワークリクエストとjsネットワークリクエストライブラリ
-
JSアレイループと効率解析の比較
-
HTML+CSS+JavaScriptで簡単な三目並べゲームを作成する。
-
JavaScriptのクロージャの説明
-
[解決済み】最大呼び出しスタックサイズ超過エラー
-
[解決済み】Node.js getaddrinfo ENOTFOUND
-
[解決済み] TypeError: $.ajax(...) is not a function?
-
[解決済み】リクエストに失敗していないのに、「TypeError: failed to fetch」が表示される。
-
OSSアップロードエラーを解決する: net::ERR_SSL_PROTOCOL_ERROR