提交后清除Rails远程表单

我正在使用带有jQuery的Rails 3，并且有一个带有单个文本输入和提交按钮的简单表单。 我有提交表单:remote => true ，并希望在提交表单后清除输入。 我试过这个jQuery代码：

 $('#new_message').submit(function() { $('#message_content').val(''); }); 

但是，这会在提交表单之前清除输入，因此我最终会提交一个空白表单。

经过一番搜索后，我也尝试了以下版本：

 $('#new_message').submit(function(e) { e.preventDefault(); this.submit(); $('#message_content').val(''); }); 

…但是这似乎覆盖了:remote => true magic，并且表单会在整页重新加载时提交。 有任何想法吗？

Answer 1

当为标记为remote => true的表单按下提交按钮时，rails.js中的javascript代码执行submit() 。 您无需覆盖该function。

在$(document).ready试试这个 –

（编辑：使用bind而不是live。感谢Darren Hicks。）

 $("#new_message").bind("ajax:complete", function(event,xhr,status){ $('#message_content').val(''); } 

这为ajax:complete事件添加了一个事件处理程序。 完成ajax-submit-form后会触发此事件。 更多这里 。

Answer 2

在你的动作 .js.erb文件中

 $('#message_content').attr('value',''); 

其中action是控制器中的方法名称（您未在问题中说明）

Answer 3

在你的jquery函数中，通过get（）自己提交。 调用get（）后，将文本字段设置为空白。 或者，您可以在为get（）提供的成功回调中执行此操作，这将允许您从控制器获取一些信息，例如提交的文本字段值是否可接受。

Answer 4

您可以像这样触发Rails AJAX提交：

 $(this).trigger('submit.rails'); 

Answer 5

在你的model.js文件中

  $('#element_id').val(' '); 

它适用于我，你可以试试这个。