Avoid double submitting a form

Question

Avoid double submitting a form

Navigation

#1 by (1 votes)
#2 by (1 votes)

2

I have a form which I send data through a post but sometimes the server takes time to respond and if you give it again in the save button it duplicates the information as I do so that the save button is disabled when it is already has once clicked on save? Header of the form:

form action="<?php echo base_url();?>movimientos/ventas/store" method="post" id="form-venta">

this is the button:

<div class="form-group">
     <button type="submit" class="btn btn-success btn-flat">Guardar</button>
     <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#modal-default2">Aplicar Descuento</button>
</div>

javascript html

asked by WilsonicX 25.06.2018 в 17:44

source

2 answers

1

You can avoid it in the following way;

We create a javascript function;

enviando = false; //Obligaremos a entrar el if en el primer submit

function checkSubmit() {
    if (!enviando) {
        enviando= true;
        return true;
    } else {
        //Si llega hasta aca significa que pulsaron 2 veces el boton submit
        alert("El formulario ya se esta enviando");
        return false;
    }
}

And in your HTML code of the form add the following;

onsubmit="return checkSubmit();"

Staying something like this;

    enviando = false; //Obligaremos a entrar el if en el primer submit
    
    function checkSubmit() {
        if (!enviando) {
    		enviando= true;
    		return true;
        } else {
            //Si llega hasta aca significa que pulsaron 2 veces el boton submit
            alert("El formulario ya se esta enviando");
            return false;
        }
    }

    <form name="form2" method="post" action="#" onsubmit="return checkSubmit();">
    <div>
      <input type="text" name="mi_texto" required>
    </div>
    <div>
      <input type="submit" value="Enviar datos">
    </div>
    </form>

NOTE: Double click quickly to try, if you do 1 only click here will throw an error, this can be interpreted as' submit valid '

answered by 25.06.2018 в 18:16

Form in IOS Take the text from a flat file (File.txt) and save it in a string

score 1 · Accepted Answer

The best option for static and UI is to disable the button when submitting until the request is completed.

Test your javascript functions using the following script

$("button").prop("disabled", false);

To re-enable the button, simply change the false to true

Place the following code in your file.

$(document).ready(function(){
    $("button").click(function(){
        $("button").prop("disabled", false);
    });
});

What you will do is when the sun is ready to execute everything that is inside, but when you click on your button or when doing a submit you will add the property disabled to this.

I do not know if you are using it with Ajax, if so, this would be otherwise.

You let me know how you are doing with this.