Por Eugenia Bahit
3.1 Exemplos de aplicação
Vimos na introdução deste manual, para que serve a propriedade action. Agora, veremos o que se pode fazer com a mesma mediante JavaScript.
Mediante JavaScript, poderemos modificar/selecionar o valor da propriedade action segundo as preferências do usuário.
O exemplo mais típico seria o de um formulário de inscrição a um boletim de novidades, onde o usuário deverá escolher, se deseja se inscrever ou cancelar sua inscrição.
Modificação do valor da propriedade action
O Script...
<script language="javascript">
function enviar(form)
{
if ((boletim.inscrever.checked == true) && (boletim.cancelar.checked == true))
{ alert("Por favor, marque somente um campo"); return true; }
if ((boletim.inscrever.checked == false) && (boletim.cancelar.checked == false))
{ alert("Deve indicar se deseja se inscrever ou cancelar"); return true; }
if (boletim.inscrever.checked == true)
{ boletim.action = "exemplos/inscrever.asp"; }
if (boletim.cancelar.checked == true)
{ boletim.action = "exemplos/cancelar.asp"; }
form.submit()
}
</script>
O formulário...
<form name="boletin" method="GET" action="exemplos/inscrever.asp" target="_blank">
<b>Inscrição gratuita ao boletim de novidades</b><br>
Por favor, introduza seu e-mail:
<input type="text" name="email" size="20"><br>
<input type="checkbox" name="inscrever" value="ON"> Fazer <b>inscrição</b> |
<input type="checkbox" name="cancelar" value="ON"> Cancelar<br>
<input type="button" onClick="enviar(this.form)" value="Enviar">
</form>
Os resultados...
Outro exemplo muito utilizado, é enviar o mesmo formulário a duas páginas diferentes. Vejamos um exemplo:
Duplicando o valor da propriedade action
O Script...
<script language="javascript">
function Envio1()
{
dados.action = "exemplos/pagina1.asp";
dados.submit()
}
function Envio2()
{
dados.action = "exemplos/pagina2.asp";
dados.submit()
}
</script>
O Formulário...
<form method="GET" name="dados" action="exemplos/pagina1.asp" target="_blank">
Seu nome: <input type="text" name="nome"><br>
Idade: <input type="text" name="idade" size="2"><br>
<input type="button" value="Enviar" onClick="Envio1(this.form); Envio2(this.form)">
</form>
Os resultados...
Da mesma forma que se pode modificar o valor da propriedade action, podem se modificar method e target. Modificar o valor da propriedade method seria um pouco ridículo já que o método pelo qual se enviam os dados, pode estar perfeitamente definido no formulário. O valor de target pode chegar a ser mais útil, se dermos ao usuário a possibilidade de decidir se quer abrir os resultados enviados em nova janela, na mesma página ou em um frame da mesma.