如何从 textarea 提交带有 ENTER 键的 AJAX 表单？答案

【问题标题】：How to submit an AJAX form with ENTER key, from textarea?如何从 textarea 提交带有 ENTER 键的 AJAX 表单？
【发布时间】：2011-06-15 13:59:39
【问题描述】：

我正在开发一个 Ruby On Rails 2.3.8 应用程序，我想知道当用户在文本区域中按下 ENTER 键时如何提交 remote_form_for 表单。

表格代码如下：

  <% remote_form_for :post, PostComment.new, :url => save_outside_comment_path(post_id), :html => { :method => :put} do |f| %>
     <%= f.text_area :comment, :rows => 1, :id => "txtOutsideComment_#{post_id}", :class => "new-reply-text" %>
  <% end %>

这是执行提交但不是 AJAX 的 jQuery 函数：

jQuery('.new-reply-text').keypress(function(e) {
    if (e.keyCode == 13 && !e.shiftKey) {
        e.preventDefault();
        this.form.submit();
    }
});

我已经从我的控制器进行了页面更新，我不想从这个 jQuery 函数中指定任何语法，如 success:。我只是希望它使用 AJAX 提交remote_form_for。

【问题讨论】：

标签： jquery ruby-on-rails ajax

【解决方案1】：

我认为您是在问如何执行 AJAX 请求而不是整页提交。如果是这样

jQuery('.new-reply-text').keypress(function(e) {
  if (e.keyCode == 13 && !e.shiftKey) {
    e.preventDefault();
    jQuery.ajax({
      url: "/my/URL",
      data: jQuery(this).form.serialize(),
      success: function(){},
      dataType: "json"
    });
  }
});

如果使用 .get 可以保存一些参数 http://api.jquery.com/jQuery.get/

或 .post http://api.jquery.com/jQuery.post/

哪些是 .ajax 的包装器 http://api.jquery.com/jQuery.ajax/

我不是 Rails 专家，因此您需要更新第一个 jQuery 对象的类/ID 才能找到 remote_form_for

【讨论】：

感谢您的回答。这样做的问题是，一旦提交表单，我已经在控制器的操作中进行 html 替换。因此，例如，我不想（或者至少我从未这样做过）从 jQuery 指定成功事件。 Rails 中还有其他方法可以做到这一点吗？
把成功函数留空
AJAX 调用背后的想法是在不重新加载整个页面的情况下处理提交请求。在这种情况下，您将触发处理提交的相同控制器操作，但它会被称为我的 AJAX 函数。然后，您将通过 AJAX 请求发送回 HTML，并在成功函数中动态替换表单（或区域）的内容。