Il modulo onSubmit determina quale pulsante di invio è stato premuto

Ho un modulo con due pulsanti di invio e un codice:

HTML:

  

Javascript:

 form.onSubmit = function(evnt) { // Do some asyncrhnous stuff, that will later on submit the form return false; } 

Naturalmente i due pulsanti di invio realizzano cose diverse. C’è un modo per scoprire su onSubmit quale tasto è stato premuto, quindi più tardi potrei thatButton.click() facendo thatButton.click() ?

Idealmente non vorrei modificare il codice per i pulsanti, ho solo un addon in puro javascript con questo comportamento.

So che FF ha evnt.explicitOriginalTarget ma non riesco a trovare nulla per altri browser.

Solutions Collecting From Web of "Il modulo onSubmit determina quale pulsante di invio è stato premuto"

Non nel gestore eventi di invio stesso, no.

Ma ciò che puoi fare è aggiungere gestori di clic a ogni invio che informsranno il gestore di invio su quale sia stato fatto clic.

Ecco un esempio completo (usando jQuery per brevità)

   Test Page     
 

jsfiddle per lo stesso

Tutte le risposte sopra sono molto buone, ma l’ho ripulita un po ‘.

Questa soluzione inserisce automaticamente il nome del pulsante di invio premuto nel campo nascosto dell’azione. Sia il javascript sulla pagina che il codice del server possono controllare il valore del campo nascosto dell’azione secondo necessità.

La soluzione utilizza jquery per applicare automaticamente a tutti i pulsanti di invio.

         

Quindi scrivi un codice come questo nel gestore dell’invio del modulo.

  if ($("#action").val() == "delete") { return confirm("Are you sure you want to delete the selected item?"); } 

Ossa nude, ma confermate funzionanti, esempio:

  

Primo suggerimento:

Creare una variabile Javascript che farà riferimento al pulsante su cui si fa clic. Lo chiamo buttonIndex

   

Ora puoi accedere a quel valore. 0 significa che è stato fatto clic sul pulsante di salvataggio, 1 significa che è stato fatto clic sul pulsante saveAndAdd.

Secondo suggerimento

Il modo in cui gestirò questo è creare due funzioni JS che gestiscono ciascuno dei due pulsanti.

Innanzitutto, assicurati che il tuo modulo abbia un ID valido. Per questo esempio, dirò che l’ID è “myForm”

modificare

   

a

  
		      	

OP ha dichiarato che non voleva modificare il codice per i pulsanti. Questa è la risposta meno intrusiva che potrei trovare usando le altre risposte come guida. Non richiede ulteriori campi nascosti, ti permette di lasciare intatto il codice del pulsante (a volte non hai accesso a ciò che lo genera) e ti dà le informazioni che cercavi da qualsiasi parte del tuo codice … quale pulsante è stato utilizzato per inviare il modulo. Non ho valutato cosa succede se l’utente utilizza il tasto Invio per inviare il modulo, piuttosto che fare clic.

  

Quindi puoi accedere alla variabile ‘iniziatore’ ovunque sia necessario eseguire il controllo. Spero che questo ti aiuti.

~ Spanky

Perché non passare in rassegna gli input e quindi aggiungere gestori onclick a ciascuno?

Non devi farlo in HTML, ma puoi aggiungere un gestore a ciascun pulsante come:

 button.onclick = function(){ DoStuff(this.value); return false; } // return false; so that form does not submit 

Quindi la tua funzione potrebbe “fare cose” in base al valore che hai passato:

 function DoStuff(val) { if( val === "Val 1" ) { // Do some stuff } // Do other stuff } 

Io uso Ext, quindi ho finito per fare questo:

 var theForm = Ext.get("theform"); var inputButtons = Ext.DomQuery.jsSelect('input[type="submit"]', theForm.dom); var inputButtonPressed = null; for (var i = 0; i < inputButtons.length; i++) { Ext.fly(inputButtons[i]).on('click', function() { inputButtonPressed = this; }, inputButtons[i]); } 

e poi quando è arrivato il momento, l'ho fatto

 if (inputButtonPressed !== null) inputButtonPressed.click(); else theForm.dom.submit(); 

Aspetta, tu dici. Questo verrà ripetuto se non stai attento. Quindi, onSubmit deve a volte restituire true

 // Notice I'm not using Ext here, because they can't stop the submit theForm.dom.onsubmit = function () { if (gottaDoSomething) { // Do something asynchronous, call the two lines above when done. gottaDoSomething = false; return false; } return true; }