たった今、
以下のjquery、css、およびhtmlコードがあり、希望どおりに機能します。ユーザーがドロップダウンを選択すると、特定のテキストボックスが表示されます。しかし、どうすればレールで簡単に行うことができますか?
HTML
<form>
<select id="sel">
<option value="">- select -</option>
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3">Option 3</option>
<option value="option4">Option 4</option>
<option value="other">Other</option>
</select>
<label id="label1" for="option1">Text box label 1
<input type="text" id="option1" />
</label>
<label id="label2" for="option2">Text box label 2
<input type="text" id="option2" />
</label>
<label id="label3" for="option3">Text box label 3
<input type="text" id="option3" />
</label>
<label id="label4" for="option4">Text box label 4
<input type="text" id="option4" />
</label>
<label id="label5" for="option5">Other
<input type="text" id="option5" />
</label>
</form>
CSS
label {
display:block;
}
Jクエリ
$(function() {
//This hides all initial textboxes
$('label').hide();
$('#sel').change(function() {
//This saves some time by caching the jquery value
var val = $(this).val();
//this hides any boxes that the previous selection might have left open
$('label').hide();
//This just opens the ones we want based off the selection
switch (val){
case 'option1':
$('#label1').show();
break;
case 'option2':
$('#label2').show();
break;
case 'option3':
$('#label1').show();
break;
}
});
});
Railsコード
<%= f.select(:title, ["Select an option","Option 1", "Option 2", "Option 3"])%>
しかし、テキストボックスを表示する方法がわかりません。選択オプションは、ここでは 3 つだけです。しかし、私のアプリケーションでは、10-15 のようになります。
ありがとう