考虑一个有两种类型的模型:A和B.两种类型都将颜色存储为字符串。 A型可以是蓝色或红色。 B型可以是白色或黑色。
当显示类型A的表单时,有一个包含[蓝色,红色]的HTML选择列表。对于类型B,选择列表包含[白色,黑色]。
为同一型号显示这两种不同选择的最佳方法是什么?
启用类型不起作用,因为在创建新模型时,没有类型。
你需要有两个创建按钮,每种类型一个吗?或者这应该设计为两个独立的模型,继承自共同的基础模型?
我根据类型的选择考虑了select的AJAX(jQuery)更新。对于一个简单的问题,这似乎是一个非常复杂的解决方案。
答案 0 :(得分:1)
我建议optgroup。
<select>
<optgroup label="type A">
<option value="blue">Blue</option>
<option value="red">Red</option>
</optgroup>
<optgroup label="type B">
<option value="black">Black</option>
<option value="white">White</option>
</optgroup>
</select>
答案 1 :(得分:1)
实施颜色类型限制绝对应该在模型中进行验证。为了保持视图与模型一致,我建议使用一些javascript:
<select class="type-select">
<option value="TypeA">Type A</option>
<option value="TypeB">Type B</option>
</select>
<select class="type-A-opts">
<option value="blue">Blue</option>
<option value="red">Red</option>
</select>
<select class="type-B-opts" style="display:none" >
<option value="black">Black</option>
<option value="white">White</option>
</select>
<script>
$(".type-select").change(function(){
var cur_value = $(this).attr("value");
if(cur_value == "TypeA"){
$(".type-A-opts").show();
$(".type-B-opts").hide();
}else{
$(".type-A-opts").hide();
$(".type-B-opts").show();
}
});
</script>