Javascript 在Java Play框架中使用JQuery更新下拉选择
我想在用户完成表单时动态地向表单添加字段输入。但是,如果用户更改了其他人依赖的前一个字段的值,那么我想再次隐藏这些后一个字段,并将其值重置回默认值。我可以毫无问题地显示和隐藏输入字段。但是,无论我做什么,我都无法更改选择下拉菜单的值 这是我的剧本:Javascript 在Java Play框架中使用JQuery更新下拉选择,javascript,jquery,forms,twitter-bootstrap,playframework,Javascript,Jquery,Forms,Twitter Bootstrap,Playframework,我想在用户完成表单时动态地向表单添加字段输入。但是,如果用户更改了其他人依赖的前一个字段的值,那么我想再次隐藏这些后一个字段,并将其值重置回默认值。我可以毫无问题地显示和隐藏输入字段。但是,无论我做什么,我都无法更改选择下拉菜单的值 这是我的剧本: $(function() { $('#type_selection').change(function() { var case_type = $('#type_selection :selected').val();
$(function() {
$('#type_selection').change(function() {
var case_type = $('#type_selection :selected').val();
if(case_type !== "") { //the default value is an empty string
$('.subtype-panel').slideDown('slow');
}
else {
$('.subtype-panel').slideUp('slow');
$('#subytype_selection').val("").change();
}
});
});
播放模板:
@(caseForm: play.data.Form[Case])
@import views.html.common._
@import models._
@implicitFieldConstructor = @{
b3.vertical.fieldConstructor
}
@main("New Case Info") {
<div class="page-header">
<h3>New Case Information<span class="pull-right label label-primary">Open</span></h3>
</div>
<fieldset>
@b3.form(action = routes.CaseController.save()) {
<div class="panel panel-primary">
<div class="panel-heading">Case Type</div>
<div class="panel-body">
<div class="row">
<div class="col-md-4">
@b3.select(caseForm("caseType"),
options = options(Case.typeOptions),
'_id -> "type_selection",
'_label -> "Case Type",
'_default -> "-- Select a Type --")
</div>
<div class="col-md-3">
@datePicker(caseForm("date"), '_label -> "Date", 'placeholder -> "mm/dd/yyyy")
</div>
</div>
</div>
</div>
<div class="panel panel-primary subtype-panel">
<div class="panel-heading">Case Subtype</div>
<div class="panel-body">
<div class="row">
<div class="col-md-4">
@b3.select(caseForm("caseSubType"),
options = options(Case.subTypeOptions),
'_id -> "subtype_selection",
'_label -> "Subtype",
'_default -> "-- Select a Subtype --")
</div>
</div>
</div>
</div>
}
</fieldset>
}
b3语法在您看来可能有点奇怪。它来自播放引导库:
对于b3 select字段,默认选项会自动分配一个空字符串值。这就是我想将我的选择改回使用JQuery的原因。解决方案如adis在评论中所说。使用_id->foo会更改整个表单组的id、标签和下拉列表,但不会专门更改选择框的id。您必须使用id->foo来执行此操作。您是否检查了b3生成的id?我认为如果你想覆盖它,你应该使用:'id->type\u选择,所以没有underscore@adis成功了!我不知道b3的规则。非常感谢。