基于rails中另一个下拉列表的值生成下拉列表值

Question

所以，基本上，当bug_type下拉列表的值为bug时，我要做的是将状态下拉列表的数值显示为[initive，started completed]，否则状态下拉列表应该显示[initial，started，resolved]

<div class="col">
<div class="form-group">
<%= form.select :bug_type, options_for_select([['Bug', 'bug'], ['Feature', 'feature']]) %> <br>
</div>
</div>
<div class="col">
<div class="form-group">
<% if @bug.bug_type == 'bug'%>
<%= form.select :status, options_for_select([['Initial', 'initial'], ['Started', 'started'], ['Completed', 'completed']]) %> <br>
<% else %>
<%= form.select :status, options_for_select([['Initial', 'initial'], ['Started', 'started'], ['Resolved', 'resolved']]) %> <br>
<% end %>
</div>
</div>

到目前为止，我试过这样做，但没有效果。此外，我还使用了用于bug_type和status的枚举。如果有其他方法可以解决这个问题，请帮帮我。

Answer 1

有两种方法可以满足您的需求。一种是客户端，您可以更改下拉值，也可以发送一个服务器端请求并呈现所需的选项。

对于客户端，你可以这样做：

<div class="col">
<div class="form-group">
<%= form.select :bug_type, options_for_select([["Bug", "bug"], ["Feature", "feature"]]) %>
</div>
</div>
<div class="col">
<div class="form-group">
<% if @bug.bug_type == "bug" %>
<%= form.select :status, options_for_select([["Initial", "initial"], ["Started", "started"], ["Completed", "completed"]]) %>
<% else %>
<%= form.select :status, options_for_select([["Initial", "initial"], ["Started", "started"], ["Resolved", "resolved"]]) %>
<% end %>
</div>
</div>
<script>
// Please change selector accoding to your DOM.
// This is bug type select dropdown
$('#bug_type_select').change(function() {
var selectedValue = $('#bug_type option:selected').val();
var bugOptions = {
'initial': 'Initial',
'started': 'Started',
'completed': 'Completed'
}
var featureOptions = {
'initial': 'Initial',
'started': 'Started',
'resolved': 'Resolved'
}
// Please change selector accoding to your DOM.
// This is status select dropdown
var $mySelect = $('#mySelect');
$mySelect.empty();
if (selectedValue === 'bug') {
$.each(bugOptions, function(key, value) {
var $option = $('<option/>', {
value: key,
text: value
});
$mySelect.append($option);
});
} else {
$.each(featureOptions, function(key, value) {
var $option = $('<option/>', {
value: key,
text: value
});
$mySelect.append($option);
});
}
});
</script>