我的表格就像这样
index.html.erb
<div id="comments_p">
<%= render (:partial => "comment", :collection => tasks.comments) %>
</div>
<% form_for :comment, :url => comment_task_path(tasks.id), :html => {:remote => true, :class => "comment_form"} do |f| -%>
<%= f.text_field :remark, :placeholder => "Add Comments", :rows => 2,
:style => "width: 834px; height: 40px;"%>
<%= f.submit "submit"%>
<% end -%>
<script type="text/javascript">
jQuery.fn.submitWithAjax = function() {
this.submit(function() {
var test = $.post(this.action, $(this).serialize(), null, "script");
$(".comment_form")[0].reset();
alert("Comment Submitted");
return false
})
return this;
};
</script>
的application.js
jQuery.ajaxSetup({
'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript")}
})
$(document).ready(function() {
$(".comment_form").submitWithAjax();
})
我的问题是我怎样才能更新我的div。警报有效,但我似乎无法找到如何更新div comments_p
答案 0 :(得分:0)
希望表单提交任务 控制器的创建方法。由于请求是后端的 js 请求,因此只需在 / app / views / tasks / <中创建一个名为 create.js.erb 的文件/ strong>文件夹,如Unobtrusive Javascript Railscasts中所述,并在成功响应后编写您想要执行的代码。
在tasks_controller.rb中获取更新的任务变量
def create
#...code for creating the comments for the task
@tasks = ... #updated record with the latest comments
end
然后 create.js.erb 文件中的响应代码就像
$("#comments_p").html('<%= render_partial :comment, :collection => @tasks.comments) %>');
comments_p div将在上述代码成功完成请求后更新。