0

この質問をベースとして使用して、依存ドロップダウンボックスを使用してフォームを設定しようとしました。ユーザーがドロップダウン ボックス 1 から必要な情報セッションを選択すると、非表示のドロップダウン ボックスが表示され、その情報セッション (およびその情報のみ) に関連する日付が表示されます。2 つの (最初は非表示の) ドロップダウン ボックスがあり、どちらが表示されるかは、ユーザーが最初のドロップダウン ボックスで何を選択したかによって異なります。

視覚的には機能しますが、データを投稿しようとするとあまり機能しません。Firebug からわかることから、「無効」はどの時点でも「真」から変化していないため、フォームはデフォルトはオプションではないと不平を言っています。firstChoice オプションは失敗し、secondChoice オプションは問題なく通過します。

HTML

<div id="myQuestions">
<select id="QuestionOptions" class="required" name="SESHTYPE">
<option selected="selected" value="Default">Choose information session.</option>
<option value="firstChoice">First One</option>
<option value="secondChoice">Second One</option>
</select>
</div>
<div id="myAnswers">
<div id="firstChoice" disabled="true" style="display: none;">
<select id="mce-INFODATE" name="INFODATE">
<option value="Default">Please choose a date:</option>
<option value="7th March">Thursday, 7th March</option>
<option value="20th March">Wednesday, 20th March</option>
<option value="11th April">Thursday, 11th April</option>
</select>
</div>
<div id="secondChoice" disabled="true" style="display: none;">
<select id="mce-INFODATE" name="INFODATE">
<option value="Default">Please choose a date:</option>
<option value="16th April">Tuesday, 16th April</option>
</select>
</div>

Javascript

    jQuery(document).ready(function($) {
    $('#QuestionOptions').change(function () {
    $('#myAnswers > div').hide().prop("disabled", true);
    $('#myAnswers').find('#' + $(this).val()).show().prop("disabled", false);
    });
    });

編集: もう少し掘り下げると、 from here のように div で disabled を使用できないことがわかりました。children() を使用すると、私がなりたい場所に到達できますか?

4

1 に答える 1

0

まず、同じ名前と ID を持つ 2 つの select を持つことはできません。それらは異なる必要があります。

次に、を無効にすることはできません。<div>非表示にすることはできますが、無効にすることはでき<select>ます。多分次のようなものを試してください：

$('#myAnswers > div').hide()
$('#myAnswers select').prop("disabled", true);
var selectedDiv = $('#myAnswers').find('#' + $(this).val());
selectedDiv.show()
selectedDiv.find('select').prop("disabled", false);
于 2013-02-12T07:17:39.170 に答える