Jquery Rails 3 ...表单提交两次...删除两次...帮助答案

【问题标题】：Jquery Rails 3... form submits twice... deletes twice... helpJquery Rails 3 ...表单提交两次...删除两次...帮助
【发布时间】：2011-07-19 12:37:09
【问题描述】：

似乎每个人都有这个问题，但没有人有外行的答案，甚至没有适当的解决方案。

我有一个表单，它使用 ajax 提交表单并自动将其添加到文本字段下方的列表中。表单提交了两次，所以我有两个相同的（除了 ID）记录。更糟糕的是，当您尝试删除它时，它不会更新页面，因为它尝试两次删除相同的记录。

我希望有人有一个很好的答案... 顺便说一句，我是 Rails 新手。代码：

index.html.erb

<h1>SSCC</h1>
<div id="orderline_form">
    <%= render 'form' %>
</div>

<ul id="orderlines">
    <%= render :partial => @orderlines.reverse %>
</ul>

_form.html.erb

<%= form_for(@orderline, :remote => true) do |f| %>
<div class="field">
    <%= f.label :Order_ID %>
    <%= f.text_field :order_id %><br/>
    <%= f.label :SSCC %>
    <%= f.text_field :sscc %>
</div>
<div class="actions">
    <%= f.submit %>
</div>
<% end %>

_order_line.html.erb

<%= content_tag_for(:li, order_line) do %>

<%= order_line.id %> |
<%= order_line.order_id %> |
<%= order_line.sscc %>
(<%= link_to 'Delete', order_line, :confirm => 'Are you sure?',
:method => :delete, :remote => true %>)

<% end %>

create.js.erb

$('#orderlines').prepend('<%= escape_javascript(render(@orderline))%>');
$('#orderlines > li:first ').effect('highlight', {}, 3000);
$('#orderline_form > form')[0].reset();

destroy.js.erb

$('#<%= dom_id(@orderline) %>').css('background', 'red');
$('#<%= dom_id(@orderline) %>').hide("fade", {}, 1500);

【问题讨论】：

你能发布 JQuery 部分（你的 .js）吗？
我的应用程序 .js 是：jQuery.ajaxSetup({ 'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript")} }) jQuery.fn.submitWithAjax = function() { this.submit(function() { $.post(this.action, $(this).serialize(), null, "script"); return false; });返回这个； }; $(document).ready(function() { $("#update_order").submitWithAjax(); }) $("form").submit(function(){ $('input[type=submit]'). attr('禁用', '禁用'); });
其他文件我有我们的标准 jquery、jquery.min、jquery_ujs、jquery-ui 和 rails.js

标签： jquery ruby-on-rails ruby-on-rails-3 form-submit

【解决方案1】：

我碰巧“application.js”被存储了两次（.../public/assets/application.js 和 .../app/assets/javascripts/application.js）。 Rails 3.2.1 资产管道编译它并创建了另一个。检查并删除不需要的。

请记住，您可能已经有其他重复的资产，您才刚刚开始注意到这一点，因为 jQuery 已经很明显了。

这个链接帮助了我：

http://www.ruby.code-experiments.com/blog/2011/10/another-gotcha-with-the-rails-31-asset-pipeline-or-why-are-my-jquery-ujs-ajax-requests-triggered-twi.html

【讨论】：

提醒一下，我遇到了这个问题，删除文件不起作用，它只有在我再次运行 assets:precompile 之后才起作用，然后用 assets:clean 跟进。我建议 assets:clean 手动删除文件。 +1 指出问题的根源。
我已经尝试过预编译和清理资产，并检查了 application.js 是否出现了两次。它没有。然后我重新启动服务器，运行代码，它仍然提交了两次。为什么会这样？顺便说一句，它不会在生产中提交两次。仅在开发中。

【解决方案2】：

在 Rails 5 上，rails-ujs 取代了 jquery_ujs。如果两者都需要，事件将触发两次

```

// app/assets/javascripts/application.js

//= 需要 jquery_ujs

//= 需要 rails-ujs

```

【讨论】：

【解决方案3】：

确保在单击提交按钮后禁用它们。它有助于定位问题。

  $("form").submit(function(){
    $('input[type=submit]').attr('disabled', 'disabled');
  });

【讨论】：

愚蠢的问题，但我应该把这段代码放在哪里......我目前在我的 application.js 文件中得到它......它不起作用
放入 $('document').ready(function(){ ... here ... })
所以问题进入了服务器端逻辑。你能复制过去你的控制器代码吗？
{ class OrderLinesController
def create @orderline = OrderLine.create!(params[:order_line]) respond_to do |format| if orderline.save format.html { redirect_to(orderlines_path, :notice => '订单行已成功创建')} format.js end end endef destroy orderline = OrderLine.find(params[:id]) orderline.destroy respond_to do |格式| format.html { redirect_to orderlines_path } format.js end end end 所有订单行都有一个 at-sign 顺便说一句...只是堆栈溢出不会让我在评论框中放置多个

【解决方案4】：

我在 Rails 4 上遇到了同样的问题。我的 development.rb 中有这些设置：

config.assets.digest = true
config.assets.enabled = true

我删除了这些并运行rake assets:clean

现在它按原样提交。

【讨论】：