jQuery - form non presenterà utilizzando jQuery

Question

seguito al mio problema qui - jQuery on submit validation, with modal dialog at the end?

Sembra che la forma semplicemente non presenterà utilizzando jQuery. Ecco il mio codice a un livello molto semplificata:

<script type="text/javascript"> 

    $(document).ready(function(){ 
     $(document).click(function() { 
      $('#inputform').submit(); 
     }); 

     $("#inputform").submit(function() { 
      alert('test'); 
      return true; 
     }); 
    }); 
</script> 

<form method="POST" action="<?php echo CURRENT_PAGE ?>" id="inputform"> 

<button type="submit" name="submit" id="submit">Submit form</button> 

</form> 

Cliccando sul corpo mostra l'avviso 'test', ma non inviare il modulo. Inoltre, alla chiusura della finestra di avviso, non verrà più visualizzata nuovamente quando si fa nuovamente clic.

È sufficiente fare clic sul pulsante di invio per visualizzare l'avviso, quindi inviare il modulo come previsto.

Ci scusiamo per quello che è (lo so) una domanda davvero stupida, ma qui sono in perdita. TY!

Answer 1

Il problema è che al pulsante di invio è stato assegnato il nome "invia". Cambialo su qualsiasi altra cosa e funzionerà. (Cambiarne anche l'id, meglio tenerli lo stesso, non ultimo a causa della some browser issues.)

Perché: Elementi del modulo hanno una proprietà chiamata submit che è la funzione è possibile chiamare per inviare loro. (jQuery usa questo sotto le copertine quando chiami submit sull'istanza jQuery.) Ma gli elementi del modulo anche ricevono le proprietà per ciascuno dei campi nel modulo, usando il nome del campo, e quindi se hai un campo chiamato "invia" , è sostituisce la funzione submit, che significa che non è possibile inviare il modulo a livello di programmazione.

Esempio di lavoro: Live copy | Live source

<script type="text/javascript"> 

    $(document).ready(function(){ 
     $(document).click(function() { 
      $('#inputform').submit(); 
     }); 

     $("#inputform").submit(function() { 
      alert('test'); 
      return true; 
     }); 
    }); 
</script> 

<form method="GET" action="http://jsbin.com/uwuzon" id="inputform"> 
<input type="text" name="foo" value="bar"> 
<button type="submit" name="someOtherName" id="someOtherName">Submit form</button> 
</form> 

(Il cambiamento significativo è la parte name="someOtherName" id="someOtherName" Le altre variazioni [cambiando l'azione e il metodo del form] sono così funziona su JSbin..)

Nota a margine: Non si dispone di return true; nel gestore di eventi submit per consentire l'invio del modulo. Devi solo nonreturn false;. :-)