status is a drop down having values (new, started, completed) if it’s a feature or (new, started and resolved) if it’s a bug. I don't know how can i do this
Model
Class Task
enum typeOf: %i[feature bug]
enum status_is: %i[New started completed resolved]
end
erb.html
<%= form_for :task, url: project_tasks_path, :html => {:multipart => true, :cla
<%= f.hidden_field :project %>
Title: <%=f.text_field :title, class:"form-control" %><br>
Description: <%=f.text_field :description, class:"form-control" %><br>
<label for="deadline">Deadline</label><input type="datetime-local" id="deadline"
name="deadline" ><br>
Screen Shot: <%=f.file_field :screen_shot, multiple: true, class:"form-control" %>
<div class="field">
<%= f.label :typeOf, class:"form-control" %><br />
<%= f.select(:typeOf, Task.typeOfs.keys.map {|role| [role.titleize,role]}) %>
</div>
<div class="field">
<%= f.label :status_is, class:"form-control" %><br />
<%= f.select(:status_is, Task.status_is.keys.map {|role| [role.titleize,role]}) %>
</div>
<%= f.submit "Add" %>
<%end %>
CodePudding user response:
I would go with two separate select boxes, each with the expected cases:
<div class="field" data-target="bug">
<%= f.label :status_is, class:"form-control" %><br />
<%= f.select(:status_is, (Task.status_is.keys - ['completed']).map {|role| [role.titleize,role]}) %>
</div>
<div class="field" data-target="feature">
<%= f.label :status_is, class:"form-control" %><br />
<%= f.select(:status_is, (Task.status_is.keys - ['resolved']).map {|role| [role.titleize,role]}) %>
</div>
And then you use a sprinkle of javascript to toggle them in/out:
function toggleSelects() {
var value = $('#task_typeOf')[0].value;
$('[data-target=bug]').toggle(value === 'bug');
$('[data-target=bug] select').attr('disable', value !== 'bug');
$('[data-target=feature]').toggle(value === 'feature');
$('[data-target=feature] select').attr('disable', value !== 'feature');
}
// execute every time the type of task is changed
$('#task_typeOf').on('change', () => toggleSelects());
// also execute at document load
$(toggleSelects);
Of course you can use different strategies or wrappers to hide the fields and disable the selects, but you have to do both (a hidden select will be submitted anyways).