La disattivazione di un pulsante di invio dopo uno scatto

Question

Ecco il mio codice:

<form name='frm' id='frm' action='load.asp' method='post' onSubmit='return OnSubmit(this)' style='margin-top:15px'> 
    <input type='submit' name='send' id='send' onclick="this.disabled=true;return true;" value='Send' title='test'> 
</form> 

Voglio che la mia funzione onsubmit da eseguire e voglio la pagina da submited. Nel mio sito web, senza presentare alcuna funzione e

Ho cercato di duplicare qui, ma la forma sembra essere distaccato e la mia funzione non viene mai eseguita ... http://jsfiddle.net/V7B3T/1/

e io no sapere quando dovrei riattivare il pulsante.

Devo farlo nel document.ready o nella funzione onSubmit?

Quindi se qualcuno può aggiustare il violino :) e dopo lo confronterò con il mio codice. penso: S Mi sono perso

Grazie a tutti

Answer 1

Se si desidera convalidare il modulo o apportare modifiche alla prima di presentare e solo presentare se il modulo è valido si può fare qualcosa di simile:

<form id="frm" action="load.asp" method="post" enctype="multipart/form-data"> 
    <input type="submit" name="send" id="send" value="Send" title="test"> 
</form> 

e il codice JavaScript:

$('#frm').bind('submit', function (e) { 
    var button = $('#send'); 

    // Disable the submit button while evaluating if the form should be submitted 
    button.prop('disabled', true); 

    var valid = true;  

    // Do stuff (validations, etc) here and set 
    // "valid" to false if the validation fails 

    if (!valid) { 
     // Prevent form from submitting if validation failed 
     e.preventDefault(); 

     // Reactivate the button if the form was not submitted 
     button.prop('disabled', false); 
    } 
}); 

Ecco un lavoro fiddle.

Answer 2

Se non si desidera inviare la pagina di questo dovrebbe fare il trucco:

onclick="this.disabled=true;return false;" 

Answer 3

mi sarebbe sicuramente spostare quel codice per esterni JS (e CSS) file a cui appartiene, ma questo dovrebbe funzionare:

onclick="this.disabled=true;this.parentNode.submit();" 

Dal momento che si sta disabilitando il tasto presentare onclick verrà disattivata una volta che la forma concreta submissi al clic avviene (onclick succede prima). Presentare il modulo con JS dovrebbe comunque fare il trucco.

http://jsfiddle.net/V7B3T/4/

Edit: Per quanto riguarda la riattivazione il pulsante, che avrebbe dovuto accadere dopo la funzione OnSubmit() ha eseguito immagino.

Answer 4

Se il tuo modulo esegue effettivamente un postback, stai effettivamente modificando la pagina, e quindi non dovrai preoccuparti di riattivare il tuo pulsante (ciò avverrà una volta caricata la pagina).

Inoltre, dal momento che si sta utilizzando jQuery, si può anche utilizzare in modo corretto e separare il markup HTML e Javascript allegando i gestori di eventi che utilizzano le funzioni di jQuery, e non onclick, onsubmit, ecc attributi su elementi HTML.

Aggiornato HTML:

<form name='frm' id='frm' action='http://jsfiddle.net/' enctype='multipart/form-data' method='post' style='margin-top:15px'> 
    <input type='submit' name='send' id='send' value='Send' title='test'> 
</form> 

Aggiornato Javascript:

function submitForm(form) { 
    alert("submitted"); 
} 

$('#send').click(function(e) { 
    this.disabled = true; 
}); 

$('#frm').submit(function(e) { 
    submitForm(this);  
}); 

Working jsFiddle

dovrete avvolgere che in una chiamata $(document).ready(function() {...}); per l'utilizzo su una pagina reale - ho lasciato perché jsFiddle esegue comunque Javascript onLoad fornito.