Jump to content
Fórum Script Brasil
  • 0

Formulario AJAX como faze-lo funcionar corretamente.


El_pancho

Question

olá, estou tendo um problema que ta me tirando o sono, em todos os <form> do meu site que tenham ajax,

como

<form action='' method='GET' name='busca_usuarios'>

<table class='admUsuario_search'>

<tr>

<td width='300px'><input type='text' name='search' class='admUsuario_search_input'></input>

</td>

<td width='190px'><input type='button' value='Buscar' class='admUsuario_search_botao' onclick='usuarioSearch(search.value);'></input>

</td>

</tr>

</table>

</form>

se o usuario escreve no campo SEARCH e APERTA ENTER, ele não chama a funçao e direciona para a página index.php (onde está essa funçao).

Como eu poderia impedir isso de acontecer, e somente realizar a funçao ajax?

ele somente funciona quando o usuario digita no campo SEARCH e CLICA NO BOTAO.

Edited by El_pancho
Link to comment
Share on other sites

2 answers to this question

Recommended Posts

  • 0

Boa tarde!

El pancho você tem 2 probleminhas visíveis ai...

O primeiro seria que seu evento "ajax" somente é disparado como você mesmo registro no "ONCLICK" ou seja....???

apenas quando o usuário CLICKAR no botão...

O segundo é que você não está tratando o evento submit do formulário.

O ideal é você tratar o submit do seu form...mas você é o capitão do navio e quer apenas bloquear o enter.

vamos la.

Como não sei o que você tem nesse seu ajax... pois uma coisa poderia nos resolver a vida:

Se a sua função ajax não desse submit no form, basta que adicione esse evento nele:

onSubmit="return false"
Porém se em algum momento da sua vida você ainda quer dar submit no form, sinto muito trate o evento dele pois é inviável ficar bloqueando a tecla enter. ex:
<script>
/*Vamos supor que se codigo ajax esteja na funcao ajax*/

var submitByClick = false; //o que nos vai bloquear o submit...

var ajax = function() //função do onclick!
{

    /*aqui seu codigo ajax bla bla bla antes de tentar dar o submit pela função...*/

    submitByClick = true; //setamos nossa condicional para true;
    document.getElementById('idDoSeuForm').submit(); //agora o submit vai funcionar
};

var submitHandler = function() //função do onsubmit!
{
    return submitByClick;
}
</script>

<body>

    <form method="get" id="idDoSeuForm" name="nomedoSeuform" onSubmit="return submitHandler()">
        <input type="text" name="inputQualquer" />
        <input type="button" value="ajax!" onClick="ajax()"/>
    </form>

</body>

Bom isso já seria o suficiente pra você conseguir o que quer....

Não usamos nenhum framework, o que seria bom já que com as condições da internet atualmente.

Não vou entrar em metodologia de trabalho mt menos suas ferramentas, espero que com isso você consiga

desenvolver o que precisa e durma em paz...

Se ainda assim não conseguir, tente mais uma vez

E claro tente voltar aqui apenas para dizer que deu certo para que mais pessoas saibam que isso resolveu esse

problema que você teve e com certeza outros virão a ter e bla bla bla ok parei de falar...

Abraços e boa sorte!

Poofy

Link to comment
Share on other sites

  • 0

Obrigado Poofy,

estava usando onclick pois era a unico TRIGGER que conhecia, até prefiro fazer agora usando onsubmit pois acho muito mais pratico apertar a tecla enter ao invés de clicar em BUSCAR.

Portanto no seu código eu teria que mudar:


&lt;script>
var ajax = function() //função do onclick!
{

/*aqui seu codigo ajax bla bla bla antes de tentar dar o submit pela função...*/

submitByClick = true; //setamos nossa condicional para true;
document.getElementById('idDoSeuForm').submit(); //agora o submit vai funcionar
};

<body>

<form method="get" id="idDoSeuForm" name="nomedoSeuform" onSubmit="ajax()">
<input type="text" name="inputQualquer" />
<input type="button" value="ajax!"/>
</form>

</body>

[/codebox]

Eu teria que mudar o input type='button' para input type='submit'?

Desde de já obrigado novamente.

:lol:

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.



  • Forum Statistics

    • Total Topics
      152.2k
    • Total Posts
      652k
×
×
  • Create New...