Question

我有一个使用ajax的表单，但是当我多次按下提交按钮时，数据会被保存几次，我该如何避免这个问题？

这是我的表格：

<!-- Modal create action -->
<%= form_for(@activo, remote: true, html: {class: "form-horizontal formulario-validado-create"}) do |f| %> <!--ajax remote: true-->
  <div class="modal fade" id="mynewactivo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
          <h4 class="modal-title" id="myModalLabel">Agregar activo</h4>
        </div>
        <div class="modal-body">

          <div class="row">
            <div class="col-md-12">
                  <div class="panel with-nav-tabs panel-default">
                      <div class="panel-heading">
                              <ul class="nav nav-tabs">
                                  <li class="active"><a href="#tab1default" data-toggle="tab">Información general</a></li>
                                  <li><a href="#tab2default" data-toggle="tab">Imagen</a></li>
                              </ul>
                      </div>

                      <div class="panel-body">
                          <div class="tab-content">
                              <div class="tab-pane fade in active" id="tab1default">

                                <div class="form-group">

                                  <%= f.label :CB, "Código de Barras:", class: "control-label col-md-3"  %>
                                  <div class="col-md-7">
                                    <%= f.text_field :CB, class: "form-control activo_cb",autofocus: true, minlength: "1", required: "true"   %>
                                  </div>

                                </div>

                                <div class="form-group">
                                  <%= f.label :Serie, "Serie:", class: "control-label col-md-3"  %>
                                  <div class="col-md-8">
                                    <%= f.text_field :Serie, class: "form-control activo_serie", minlength: "3", required: "true"   %>
                                  </div>
                                </div>

                                <div class="form-group">
                                  <%= f.label :Descripcion, "Descripción:", class: "control-label col-md-3"  %>
                                  <div class="col-md-8">
                                    <%= f.text_field :Descripcion, class: "form-control activo_descripcion", minlength: "3", required: "true"  %>
                                  </div>
                                </div>

                                <div class="form-group">
                                  <%= f.label :Modelo, "Modelo:", class: "control-label col-md-3"  %>
                                  <div class="col-md-8">
                                    <%= f.text_field :Modelo, class: "form-control activo_modelo", minlength: "3", required: "true"  %>
                                  </div>
                                </div>

                                <div class="form-group">
                                  <%= f.label :Status,"Activo:", class: "control-label col-xs-3 col-sm-6 col-md-1 " %>
                                  <div class="col-md-1">
                                    <%= f.check_box :Status,{checked: true}, "Disponible", "No disponible" %>

                                  </div>
                                </div>




                                  <%= f.hidden_field :IdEmpresa, value: current_usuario.empresa_id %>
                              </div>


                              <div class="tab-pane fade" id="tab2default">
                                  <div class="form-group">
                                    <%= f.label :cover, "Imagen:", class: "control-label col-md-3" %>
                                    <div class="col-md-9">
                                      <%= f.file_field :cover, class: " cliente-telefono" %>
                                    </div>
                                  </div>

                              </div>

                          </div>
                      </div>
                  </div>
              </div>

        </div>

        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal" id="mynewactivoclose">Cerrar</button>
          <%= submit_tag "Crear", class: "btn btn-primary"%>
        </div>
      </div>
    </div>
  </div>
<%end%>
</div>

我在控制器中创建的方法：

def create
    @activo = Activo.new(activo_params)

    respond_to do |format|
      if @activo.save
        format.html { redirect_to @activo, notice: 'Activo was successfully created.' }
        format.json { render :show, status: :created, location: @activo }
        format.js {flash.now[:notice] = 'El activo se ha creado de forma exitosa.'} #ajax
      else
        format.html { render :new }
        format.json { render json: @activo.errors, status: :unprocessable_entity }
        format.js {flash.now[:alert] = 'Error al crear el activo.'} #ajax
      end
    end
  end

我的create.js.erb：

<% if @activo.save %>
$("#mynewactivo").modal('hide');
$(".activo_cb").val('');
$(".activo_modelo").val('');
$(".activo_descripcion").val('');
$(".activo_serie").val('');

  $("#container_activos").prepend('<%= j render @activo %>'); //Prepend before append
  $("#activo_<%= @activo.id %>").hide().fadeIn(1000);

  $("#notice").html("<%= escape_javascript(render :partial => 'partials/flash' , :locals => { :flash => flash }).html_safe %>");

  setTimeout(function(){
    $('#notice').fadeIn("slow", function() {
      $(this).create();
    })
  }, 1500);

<%end%>

Answer 1

怎么样：

<%= submit_tag "Crear", class: "btn btn-primary", data: { disable_with: 'Crearing' }%>

检查here。

避免在ajax中复制数据

1 个答案: