如何对表单html (ruby)做条件



我有一个带有输入的表单,并且在这个表单中还有一个复选框。当我单击此框时,它会显示它下面的另一个表单(单击复选框是可选的),第二个表单可能不会被填充。问题是,当我没有插入第二种形式的反应,当我得到最后的结果(PDF),它显示我空白的地方的答案(第二种形式)。如果填满了,我希望它显示结果,如果没有填满,我不希望看到答案的输入为空

这是我的代码

<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="employee_code" >first name<span class="necessary-field">*</span></label>
<%= f.text_field :name_en, :value => @employee.first_name , :class => 'form-control' %>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="employee_code" >last name<span class="necessary-field">*</span></label>
<%= f.text_field :name_last, :value => @employee.last_name , :class => 'form-control' %>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="employee_code" >Country<span class="necessary-field">*</span></label>
<%= f.text_field :Country_en, :value => (Country.find(@employee.nationality_id).name unless @employee.nationality_id.nil?) , :class => 'form-control' %>
</div>
</div>
</div>
<hr class="label-underline"></hr>
<div id="second_form">

<%= check_box_tag(:name, :value , false, {:onchange => "#{remote_function(:url => {:controller => "form_two", :action => "done"}
)}
"})%><%= "second_form" %>
</div>

HTML中不允许嵌套表单元素——这不仅仅是验证器发出的抱怨。这种情况下的行为是不规范的,可能会表现得不合理。举个例子:

<form action="/foo">
<form action="/bar">
<input type="submit" value="Submit">
</form>
</form>

点击按钮是将请求发送给/foo还是/bar?也许这两个?

你所能做的就是在页面上设置一组嵌套的输入,这些输入最初是隐藏的,然后当你点击按钮时显示出来:

<%= form_with(model: @thing) do |form| %>
<%= form.check_box_tag(:foo, class: "visibility_toggle", data: { target: "second_form" }) %>
<fieldset id="second_form" class="hidden">
<%= form.fields_for(:other_thing) do |ff| %>
<%= ff.text_input :foo %> 
<% end %>
</fieldset>
<% end %>
document.addEventListener("change", function(event){
if (!event.target.matches(".visibility_toggle")) return;
document.getElementById(event.target.dataset.target)
.classList
.toggle('hidden');
});

这些实际上只是普通的输入,但fields_forname属性中添加了一组额外的括号,以便它们在参数中分组为散列。

你真的应该考虑一下你是否真的想把所有的东西都放到一个表单里。在用户填写基本信息后,你可以重定向到步骤2,这样更便于访问,也可以提供更好的用户体验。

参见Rails指南-构建复杂表单。

最新更新