[Resolvido] Obter nome do formulário pertencente

[Tiago Souza Ribeiro 8]

Olá, estou fazendo uma função de validação de campos de formulário e para evitar ter várias funções para o mesmo fim, uma apenas será usada em todos formulários. A estrutura que pretendo usar é seguinte:

function valida(form) {
switch(form) {
case "login":
// Executa validações para formulário de login
break;
case "registro":
//Executa validações para formulário de registro
break;
...
}

Essa função é chamada no botão de envio do formulário, num onclick, e caso nenhum problema seja encontrado, executa um submit(); no formulário:

<input type="button" onclick="valida('nome do formulário');" value="Enviar" />

Então, o que eu quero saber é, se tem como alí na chamada da função, ao invés de colocar o nome do formulário, automaticamente detectar o atributo name do <form ... > no qual o <input... /> está inserido. É possível?

 

No aguardo, até mais ^^

[JCMais 75]

Sim:

oTeuInput.form.name

[William Bruno 1501]

o correto é disparar no evento onsubmit do próprio formulário.

 

ai bastaria fazer:

<form action="" name="form1" onsubmit="funcao( this.name )">

 

porém, veja que o atributo name na tag FORM, tb não é mais recomendado como boa prática.

O mais bonito, seria usar o ID.

[Tiago Souza Ribeiro 8]

Sim:

oTeuInput.form.name

Nesse caso, ficaria da seguinte forma?:

<input type="button" onclick="valida(this.form.name);"... />

Dessa maneira, não estaria tentando encontrar um <form> dentro do <input>?

 

o correto é disparar no evento onsubmit do próprio formulário.

 

ai bastaria fazer:

<form action="" name="form1" onsubmit="funcao( this.name )">

 

porém, veja que o atributo name na tag FORM, tb não é mais recomendado como boa prática.

O mais bonito, seria usar o ID.

Bom, no onsubmit eu não consigo entender como parar o envio do formulário, já que se eu mostrar uma mensagem de erro em algum campo, o formulário será enviado do mesmo jeito, por isso usei no <input..., achei que seria mais correto "verificar antes de enviar" e não "verificar enquanto envia".

Sobre o uso de ID: eu acho incômodo criar várias variáveis para tratar o formulário, campos e div. Segundo o que aprendi, variáveis são espaços na memória reservados para o armazenamento de dados, se eu criar muitas variáveis, o consumo de memória no cliente será maior, causando menor desempenho, e gerando travamentos, não? Ou isso não se atribui ao JavaScript?

 

Obrigado aos dois por responderem ^^

[William Bruno 1501]

Bom, no onsubmit eu não consigo entender como parar o envio do formulário

basta usar um return false;

 

 

Segundo o que aprendi, variáveis são espaços na memória reservados para o armazenamento de dados

Perfeito.

Mas note que IDs não gastam espaço na memória. É apenas um atributo a mais no html(string).

 

E pensando em performance, é mais rápido para os interpretadores javascript irem atrás de um ID, doq buscarem um form.campo.atributo...

[Tiago Souza Ribeiro 8]

O que eu disse que gasta espaço na memória, são as variáveis necessárias para representar os elements, ex:

var teste = document.getElementById("teste");

Num script muito grande, serão criadas várias variáveis, já que ninguém vai ficar digitando o document.get... toda hora, e isso não faria o navegador usar mais memória?

 

Ah, uma curiosidade aqui: nos <input>'s tem que usar name mesmo, lá pros arrays do $_POST e $_GET no PHP ou tem algum atributo que substitua ele? É esquisito ficar name e id, na maioria das vezes iguais; não dá pra usar id como nome do campo na hora de enviar pro PHP, sem precisar do name não? É só curiosidade, nada de importante...

 

Até mais.

 

------ Edit:

Fiz do seu jeito ae usando onsubmit();, olha como ficou:

function validate(form) {
switch(form) {
	case "auth":
		var form = document.getElementById("auth");
		var id = document.getElementById("userid");
		var key = document.getElementById("userkey");
		var error = document.getElementById("login-error");
		if(id.value == "") {
			error.innerHTML = "O email de acesso não pode ficar em branco.";
			id.focus();
			return false;
		}
		else if(key.value == "") {
			error.innerHTML = "A senha de acesso não pode ficar em branco.";
			key.focus();
			return false;
		}
	break;
}
}

A chamada:

<div id="login">
<form id="auth" method="post" onsubmit="validate(this.id);">
	<input id="userid" type="text" name="userid" value="teste" />
	<input id="userkey" type="password" name="userkey" />
	<input type="submit" name="do-login" value="Ok" />
</form>
<div id="login-error"></div>
</div>

Tentei assim, mas mesmo quando algum campo está vazio, o formulário é enviado, a mensagem de aviso falando do campo vazio aparece rapidamente antes dele ser enviado. O que há de errado?

 

-----> Resolvido: Tinha que colocar um return lá no onsubmit, ficando assim:

onsubmit="return validate(this.id);"

 

Valeu mais uma vez iMasters *------*