¿Cuál es el evento para capturar el envío del formulario en Javascript?

Question

Un par de preguntas aquí:

• me preguntaba qué evento lo uso para ejecutar algunos javascript en el envío de formularios (para hacer un poco de validación)?
• Una vez que he hecho mi validación, ¿cómo presento el formulario en javascript?

Saludos ...

Answer 1

Digamos que usted tiene un formulario denominado myForm:

var form = document.getElementById('myForm'); 

Para la captura de presentación:

try { 
    form.addEventListener("submit", someFunction, false); 
} catch(e) { 
    form.attachEvent("onsubmit", someFunction); //Internet Explorer 8- 
} 

Nota: Si desea detener el formulario de enviar, usted hace someFunction devuelve falso.

para enviar el formulario:

form.submit(); 

Answer 2

Si utiliza jQuery, que tiene una bonita incorporada enlace de eventos formulario de envío que puede hacer la vida muy fácil. Echa un vistazo a la siguiente:

http://docs.jquery.com/Events/submit

Answer 3

1) ¿Está buscando OnSubmit evento?

2) Puede invocar una función como validate() en el evento onsubmit y devolver falso si la validación falla. Si es falso, devuelve falso de la función de envío.

puede ser,

<form name="test" OnSubmit = "return Submit()"> 

function Submit() 
{ 
return Validate() 
} 

function Validate() 
{ 
//Validation code goes here 
} 

Answer 4

Puede utilizar addEventListener(event, callback) pero nunca ha sido debidamente soportado por Internet Explorer.

IE usa attachEvent(event, callback) en su lugar.

Recomiendo encarecidamente utilizar una función prefabricada addEvent (muchos disponibles) o una biblioteca como jQuery, Prototype, Mootools, etc., ya que todas tienen excelentes funciones de manejo de eventos incorporadas.

Answer 5

Eché un vistazo a los comentarios de Serhiy en la publicación de Sasha. El ejemplo jsFiddle Serhiy siempre era interesante, y yo quería escribir una respuesta que describe el comportamiento que Serhiy mencionó:

Digamos que usted tiene un formulario denominado myForm:

var form = document.getElementById('myForm'); 

Para la captura de presentación cuando se utiliza un submit botón (< input type = 'submit' >):

try { 
    form.addEventListener("submit", validationFunction, false); 
} catch(e) { 
    form.attachEvent("onsubmit", validationFunction); //Internet Explorer 8- 
} 

Nota: Si desea detener la forma de presentación, que hacen validationFunction retorno falsa.

para enviar el formulario a través de JavaScript:

form.submit(); 

NOTA: Si utiliza un "botón" < input type = onclick = "form.submit()"/>, los controladores de eventos onsubmit añade a la No se llamará a attachEvent. Por lo tanto, debe usar algo como:

< tipo de entrada = "button" onclick = "if (validationfunction()) form.submit();"/>

o, alternativamente, si usted tiene un botón:

Puede agregar Javascript para insertarse en evento de clic del botón. var btnValidateAndSubmit = document.getElementById ("btnValidateAndSubmit");

try { 
    btnValidateAndSubmit .addEventListener("click", validationAndSubmitFunction, false); 
} catch(e) { 
    btnValidateAndSubmit .attachEvent("onclick", validationAndSubmitFunction); //Internet Explorer 8- 
} 

Por último, digamos que usted está trabajando fuera de un formulario web de SharePoint para editar un elemento de la lista, y desea agregar una validación personalizada para el formulario web. Puede agregar el siguiente javascript al formulario web para agregar validación personalizada a onclick para los botones Aceptar.

var oElements = document.getElementsByTagName("input"); 
for (var i=0; i< oElements.length; i++) 
{ 
    var elementName = oElements[i].getAttribute("Title"); 
    var elementType = oElements[i].getAttribute("type"); 
    var elementValue = oElements[i].value; 

    if (elementType=="button" && elementValue=="OK") 
    { 
    var okbutton = oElements[i]; 

    // alert("typeof okbutton.onclick = "+typeof okbutton.onclick); 
    if (typeof okbutton.onclick == "function") 
    { 
     var previousfunction = okbutton.onclick; 

     okbutton.onclick = function() 
     { 
      if (validateForm()) 
      { 
       previousfunction(); 
      } 
     }; 

    } 
    else 
    { 
     var aspnetForm = document.getElementById("aspnetForm"); 
     aspnetForm.attachEvent("onsubmit",validateForm); 

     okbutton.onclick = function() 
     { 
      if (validateForm()) 
      { 
       aspnetForm.submit(); 
      } 
     }; 
    } 


    } 
}