onsubmit on form.submit()

Descobri recentemente que os padrões da W3C não permitem que, ao executar a função javascript form.submit(), as funções inseridas no parametro onsubmit de um formulário sejam executadas, somente realizando onsubmit através do input especifico (<input type=submit>). Achei isso muito estranho, e as circunstâncias em que eu trabalhava exigia que eu fosse capaz de criar um botão de submit que pudesse ser utilizado com qualquer formulario, esteja o botão declarado dentro ou fora do formulario, quer existam ou não funções declaradas no campo onsubmit;

Primeira Solução

Após uma simples busca encontrei a seguinte função:

if(form.onsubmit()) {
return form.submit();
}

Excelente e simples solução para o problema. Ele tenta executar as funções descritas no onsubmit, e então executa o submit.

Mas e se o formulário não possuir um onsubmit ? Oops… um erro ocorre…

Solução Final

Para gerar uma função genérica, que pudesse com qualquer formulário, tive de decair ao nivel do gambi-development, os quais quem me conhece sabe que repudio com fervor. A função final ficou parecida com isto:

if(typeof form.onsubmit == "function") {
if(!form.onsubmit()) {
return false;
}
}
return form.submit();

Ele verifica se existe a função onsubmit, executa ela se existente, retorna false se o retorno dela for false, e por fim executa o submit se o resultado do onsubmit for verdadeiro ou a função não existir

Não me orgulho do resultado encontrado, nem um pouco elegante, mas resolve o problema de minha aplicação.

Deixando a Solução mais Elegante

Quando eu idealizei a função acima, em julho de 2008, eu a utilizava em apenas um local que era invocado automaticamente com o template de formulários do gerenciador de nosso sistema. Porém, esta função facilita muito a vida de todos em qualquer outra ocasião onde um formulario deve ser preenchido e tu tem usar a função form.submit() para envia-lo. A solução, portanto, permaneceu não-elegante devido ao fato de não ter ser reutilizada em outro lugar.

Anyway, um jeito bem simples de deixar a solução elegante é criar uma função que a executa passando o formulario por parâmetro.


// form_submit
// submits a form, checking if there is a onsubmit function defined for it
//
// @author hagnat
// @see http://hagnat.wordpress.com/2008/07/22/onsubmit-on-formsubmit
// @param object[form] the form being submitted
function form_submit(form)
{
if(typeof form.onsubmit == "function") {
if(!form.onsubmit()) {
return false;
}
}
return form.submit();
}


Eu podia meter ainda uns testes para prevenir erros usando try-catch, mas dae é complicar desnecessariamente a função. Imagino que quem utilizar esta função saberá colocar os pontos nos i’s e passar os parâmetros corretos para a função

Tadah! Agora basta invocar a função form_submit(form) dentro do onClick de um a ou input. E aquela solução tosca fica um pouco menos tosca