如何防止表单提交按钮在rails中的页面重新加载/刷新时禁用自身?

时间:2016-01-19 10:17:45

标签: jquery ruby-on-rails ajax

我有一个Rails应用程序,我的Sales Opportunity show页面中内置了一个表单来更新Sale Qualifiers(基本上是预先加载的用户必须回答的问题)。我正在使用AJAX从表单提交条目,创建新的SaleQualifier并返回部分页面,显示用户回答的后续问题。这一切都很好。

无意中我重新加载了Sales Opportunity页面而没有向表单提交任何内容。其余的内容加载正常,但提交按钮神秘地禁用了自己。如果我单击其他操作然后返回Sales Opportunities show操作,则该按钮再次正常工作。该按钮通常设置为disable_with 'Submitting...',以便让用户知道正在处理请求,但是当页面重新加载时,按钮仍显示正常的“提交”,因此我认为这不是原因。 / p>

销售机会显示控制器:

  def show
   @sales_opportunity = SalesOpportunity.includes(:company, :user, :timeline_events, :sale_contacts, :swots, :sale_competitors).find(params[:id])
   session[:sales_opportunity_id] = @sales_opportunity.id
   @sale_qualifier = SaleQualifier.new(sales_opportunity_id: params[@sales_opportunity.id])
     @answer = @sale_qualifier.build_answer
   @question = Question.find(@sales_opportunity.next_question)
unless @sales_opportunity.next_question == 1
     @prior_sale_qualifier = SaleQualifier.find_by(question_id: @sales_opportunity.prior_question)
   end
 end

违规表格:

<div class="panel panel-default">
  <%= form_for(@sale_qualifier, :html => {role: :form, 'data-model' => 'sale_qualifier'}, remote: true) do |f| %>
  <% if @sale_qualifier.errors.any? %>
   <div id="error_explanation">
    <h2><%= pluralize(@sale_qualifier.errors.count, "error") %> prohibited this answer from being saved:</h2>
    <ul>
    <% @sale_qualifier.errors.full_messages.each do |message| %>
      <li><%= message %></li>
    <% end %>
    </ul>
   </div>
  <% end %>
  <div class="panel-body">
   <div class="col-sm-6">
    <h2><%= @question.question_text %></h2>
    <% unless @question.id == 1 %>
      <p><%= link_to('Back', edit_sale_qualifier_path(@prior_sale_qualifier), data: { disable_with: "Loading..." }, :remote => true) %></p>
    <% end %>
   </div>
    <div class="col-sm-6">
     <div class="form-group">
      <%= f.hidden_field :sales_opportunity_id, :value => @sales_opportunity.id %>
     </div>
     <div class="form-group">
      <%= f.hidden_field :question_id, :value => @question.id %>
     </div>
      <% unless @question.id == 1 %>
      <div class="form-group">
        <%= f.hidden_field :prior_question_id, :value => @prior_question_id %>
      </div>
      <% end %>
      <%= f.fields_for :answer do |answer| %>
       <% if @question.answer_type == 'Text Field' %>
        <%= answer.text_area :answer_text, :placeholder => "Enter your answer" %>
      <% end %>
      <% if @question.answer_type == 'Datetime' %>
      <div class='input-group date' id='datetimepicker' data-date-format="YY.MM.DD">
        <%= answer.text_field :answer_text, class: "form-control", data: { date_format: 'YYYY/MM/DD' }, :placeholder => "YYYY/MM/DD" %>
        <span class="input-group-addon">
          <span class="glyphicon glyphicon-calendar"></span>
         </span>
      </div>
        <% end %>
        <% if @question.answer_type == 'Boolean' %>
          <%= answer.select :answer_text, [['Yes', true], ['No', false]] %>
        <% end %>
        <% if @question.answer_type == 'Update' || @question.answer_type == 'Result' %>
          <%= answer.hidden_field :answer_text, :value => "Updated" %>
        <% end %>
      <% end %>
       <% if @question.answer_type == 'Update' || @question.answer_type == 'Result' %>
        <div class="actions">
          <%= f.submit "Done", class: "btn btn-large btn-success", data: { disable_with: "Submitting..." } %>
        </div>
       <% else %>
        <div class="actions">
          <%= f.submit "Submit", class: "btn btn-large btn-success", data: { disable_with: "Submitting..." } %>
        </div>
       <% end %>
      <% end %>
     </div>
   </div>
</div>

知道导致这个错误的是什么以及我如何压制它?

1 个答案:

答案 0 :(得分:0)

所以,显然这是Firefox中的一个错误/功能,它会在刷新时记住页面输入值(为什么会这样做?)。在任何情况下,删除它的方法是关闭自动完成:

<%= f.submit "Submit", class: "btn btn-large btn-success", data: { disable_with: "Submitting..." }, autocomplete: 'off' %>

将问题排除在外。