我有两个下拉菜单,例如sub_element
和material
。我添加了一些javascript来更改material
取决于所选的sub_element
值。现在,sub_element
表有另一列名为Answer_Type
。此列的值为“M”和“T”。因此,如果来自material
表的'Answer_Type'为'T',sub_element
下拉列表应该会更改。请提出任何想法。请参阅以下页面。
<% content_for :javascript do %>
var master_surveys = <%=
Condition::MasterSurvey.all.map {|ms| {id: ms.Master_Survey_Code, to_s: ms[:Master_Survey_Name]}}.to_json.html_safe
%>
var elements = <%=
elements = Hash.new { |hash, code| hash[code] = [] }
Condition::Element.all.each {|e| elements[e.Master_Survey_Code] << {id: e.Element_Code, to_s: e.Element} }
elements.to_json.html_safe
%>
var sub_elements = <%= sub_elements = Hash.new { |hash, code| hash[code] = [] }
Condition::SubElement.all.each {|s| sub_elements[s.Element_Code] << {id: s.Sub_Element_Code, to_s: s.Sub_Element} }
sub_elements.to_json.html_safe
%>
var materials = <%=
materials = Hash.new { |hash, code| hash[code] = [] }
Condition::RenewSchedule.all.each {|rs| materials[rs.Sub_Element_Code] << {id: rs.Material_Code, to_s: rs.Material} }
materials.to_json.html_safe
%>
<% end %>
<div class="styled-select">
<%= form_for(@enr_rds_surv_rdsap_xref) do |f| %>
<% if @enr_rds_surv_rdsap_xref.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(@enr_rds_surv_rdsap_xref.errors.count, "error") %>:</h2>
<ul>
<% @enr_rds_surv_rdsap_xref.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="field">
<%= f.label :Master_Survey %><br/>
<%= f.select :master_survey, [], { :prompt => 'Please Select' } %>
</div>
<div class="field">
<%= f.label :Element_Code %><br/>
<%= f.select :Element_Code, [], { :prompt => 'Please Select' } %>
</div>
<div class="field">
<%= f.label :Sub_Element_Code %><br/>
<%= f.select :Sub_Element_Code, [], { :prompt => 'Please Select' } %>
</div>
<div class="field">
<%= f.label :Material_Code %><br/>
<%= f.select :Material_Code, [], { :prompt => 'Please Select' } %>
// Here i want to add a text box by if condition //
<% end %>
</div>
<div class="actions">
<%= f.submit 'Save'%>
</div>
<% end %>
</div>
$(function() {
if ($('html.enr_rds_surv_rdsap_xrefs.new, html.enr_rds_surv_rdsap_xrefs.createElement, '+
'html.enr_rds_surv_rdsap_xrefs.edit, html.enr_rds_surv_rdsap_xrefs.update').length == 0) return;
var master_survey_dropdown = document.getElementById('enr_rds_surv_rdsap_xref_master_survey');
var element_dropdown = document.getElementById('enr_rds_surv_rdsap_xref_Element_Code');
var sub_element_dropdown = document.getElementById('enr_rds_surv_rdsap_xref_Sub_Element_Code');
var material_dropdown = document.getElementById('enr_rds_surv_rdsap_xref_Material_Code');
var dropdowns = [master_survey_dropdown, element_dropdown, sub_element_dropdown, material_dropdown];
var populate_dropdown = function(dropdown_number, values) {
var dropdown;
// remove all but the first option
for (var i=dropdown_number; i<dropdowns.length; i++) {
dropdown = dropdowns[i];
$(' > option + option', dropdown).each(function() {
this.parentNode.removeChild(this);
});
};
dropdown = dropdowns[dropdown_number];
for (var i=0; i<values.length; i++) {
var value = values[i];
var option = document.createElement('option');
option.value = value.id;
$(option).text(value.to_s);
dropdown.appendChild(option);
};
};
populate_dropdown(0, master_surveys);
$(master_survey_dropdown).change(function() {
var master_survey_id = master_survey_dropdown.value;
populate_dropdown(1, elements[master_survey_id]);
});
$(element_dropdown).change(function() {
var element_id = element_dropdown.value;
populate_dropdown(2, sub_elements[element_id]);
});
$(sub_element_dropdown).change(function() {
var sub_element_id = sub_element_dropdown.value;
populate_dropdown(3, materials[sub_element_id]);
});
});
因此,在最后一个字段中,我想将下拉列表更改为Answer_Type
Sub_Element
表中{{1}}的值。