我在php的zend框架中需要关于依赖下拉列表的帮助。我经历了很多答案,但我的问题仍然存在。
我想在ajax响应的基础上创建两个下拉列表。在第一个下拉选择的基础上,将填充第二个下拉列表。
我的ajax响应就像
{"val1":"text1","val2":"text1","text3":{"subval1":"subtext1","subval2":"subtext2","subval3":"subtext3"},"text4":{newsubval1:newsubtext1,newsubval2:newsubtext2},"others":"Others"}
我想如果我选择text1第二个下拉列表仍然隐藏,如果我选择text3,那么第二个下拉列表中只会显示3个选项。
我尝试过像
res = JSON.parse(res);
$el = $(".first-dropdown");
$subel = $(".second-dropdown");
$el.empty();
$subel.empty();
$el.append($("<option></option>")
.attr("value", '').text('Please Select'));
$.each(res, function(value, key) {
if(key instanceof Object || key instanceof Array) {
$el.append($("<option></option>")
.attr("value", value).text(value));
$.each(key, function(value1, key1) {
$subel.append($("<option></option>")
.attr("value", value1).text(key1));
});
} else {
$el.append($("<option></option>")
.attr("value", value).text(key));
}
});
我的HTML代码就像
<div class="col-xs-12 first" id="first">
<label for="message-text" class="col-xs-6 col-sm-4 control-label">first request*</label>
<select class="first-dropdown" style="width: 300px;">
<option >--Select Reason--</option>
</select>
</div>
<div class="col-xs-12 second hidden" id="explaination">
<label for="message-text" class="col-xs-6 col-sm-4 control-label">Second Request*</label>
<select class="second-dropdown" style="width: 300px;">
<option >--Explain Reason--</option>
</select>
</div>
但它显示第二个下拉列表中的所有值。我只希望在第二个下拉列表中选择选项的值。