【发布时间】:2015-09-28 10:39:34
【问题描述】:
为了使我的 rails html 更具可读性,我将它的几个部分提取为部分。然后我使用 jquery 来渲染部分。问题是现在表单已经完全“脱钩”了,可以这么说,这意味着当我尝试提交表单时,它的行为就好像部分不存在一样。我怀疑我不太了解表单的工作原理,因为在与此相关的其他答案中似乎甚至没有解决表单构建器。
This SO question 似乎与我想做的事情有关,但我认为我太缺乏经验,无法正确掌握它
到目前为止我的代码如下:
/assets/javascripts/work_order.js
$(document).ready(function(){
$('.best_in_place').best_in_place();
$('#work_order_dueDate').datepicker();
$.datepicker.setDefaults({ dateFormat: 'dd-mm-yy'});
var selection_made = false
$('#work_order_project_type_id').change(function(){
if (!selection_made){
selection_made = true
var selection = $(this).find('option:selected').text();
if (selection == "Variable Data Mailing"){
$.get('/presort_informations/new');
$.get('/printing_instructions/new');
}
else if (selection == "Mailing"){
$.get('/presort_informations/new');
}
else if (selection == "Print Job"){
$.get('/printing_instructions/new');
}
}
});
});
然后
/views/work_orders/_form.html.erb
<%= form_for(@workorder) do |f| %>
<% if @workorder.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(@workorder.errors.count, "error") %> prohibited this workorder from being saved:</h2>
<ul>
<% @workorder.errors.full_messages.each do |message| %>
<li><%= message %></li>
<% end %>
</ul>
</div>
<% end %>
<fieldset class="general-info">
<legend>General</legend>
<div class="col-md-12">
<div class="col-md-3">
<div class="form-group">
<%= f.label :Job_Title, class: "control-label" %>
<%= f.text_field :title, class:"form-control" %>
</div>
<div class="form-group">
<%= f.label :Project_Type, class: "control-label" %>
<%= f.collection_select(:project_type_id, ProjectType.all, :id, :name, {:prompt => true}, {:class => "form-control"}) %>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<%= f.label :Rep, class: "control-label" %>
<%= f.text_field :rep, class:"form-control" %>
</div>
<div class="form-group">
<%= f.label :Labels, class: "control-label" %>
<%= f.collection_select(:labels_id, Labels.all, :id, :name, {:prompt => true}, {:class => "form-control"}) %>
</div>
</div>
<div class="col-md-3">
<div class= "form-group">
<%= f.label :Due_Date, class: "control-label" %>
<%= f.text_field :dueDate, class: "form-control" %>
</div>
<div class="form-group">
<%= f.label :Project_Description, class: "control-label" %>
<%= f.text_area :projectDescription, class: "form-control" %>
</div>
</div>
</div>
</fieldset>
<fieldset class="presort-information">
</fieldset>
<div class="col-md-6 printing">
</div>
<fieldset class="production-details">
<legend>Production</legend>
<%= f.fields_for :production_details, ProductionDetails.new do |ff| %>
<%end%>
</fieldset>
<%= f.hidden_field(:number, :value => @workorder.number) %>
<%= f.hidden_field(:client_id, :value => @workorder.client_id) %>
<%= f.submit(class: "btn btn-default") %>
<% end %>
并作为其中一个部分的示例:
/app/views/presort_informations/new.js.erb
$('.presort-information').append( '<%= j render("presort_informations/form") %>' );
/app/views/presort_informations/_form.html.erb
<legend>Mailing</legend>
<%= fields_for :presort_information, PresortInformation.new do |ff| %>
.
.
.
<% end %>
我不太确定如何将这一切联系在一起,以便我可以根据选择框加载部分内容,然后将它们作为一个表单提交。
编辑: 我发现 this SO question 处理相同的问题,但我怀疑因为我在页面加载后渲染部分内容,我不再有权访问表单构建器变量。
$('.presort-information').append( '<%= j render("presort_informations/form", f: f) %>' );
在调用时给出未定义的变量错误。我仍然不确定如何弥合 jquery 和 rails 之间的差距。
【问题讨论】:
标签: javascript jquery ruby-on-rails