Ir para conteúdo
Fórum Script Brasil
  • 0

formulário com campos obrigatórios


Alexadre Di Salvo

Pergunta

Olá galera,

Estou fazendo um formulário com o intuito de ser um ''PEDIDO DE MÚSICAS'', será um form em que os ouvintes pedem suas musicas pelo site.

O form terá basicamente:

-Nome

-Cidade

-Estado

-Música e Cantor (ou banda)

-Botão limpar e enviar

A parte do formulário é tranquilo, faço rapidão, mas o que quero nesse form é fazer com que Nome e música sejam campos obrigatórios e caso as pessoas não preencham esse campo exibir uma janela de alerta dizendo que o preenchimento desse campo é obrigatório.

E quando todos os campos forem preenchidos perfeitamente e ao clicar em enviar exibir um janela dizendo: ENVIADO COM SUCESSO.

Vale frisar que o site está todo em html, css e asp.

Manjo de JAVA mas não de JS, aliás nunca tentei fazer nada em JS e queria uma ajuda de vocês.

Link para o comentário
Compartilhar em outros sites

11 respostass a esta questão

Posts Recomendados

  • 0

Existem váááárias formas de se fazer validação de campo...

Você pode usar a que está disponível aqui mesmo no fórum, no repositório de scripts (scripts prontos) clicando aqui e procurando por "obrigatório" ou "validação" no ctrl+F (não te passo o link direto pra você ver que tem troceeeeentos scripts lá, que podem te ajudar na próxima ^^).

O modo que tá lá usa uma alteração no nome dos campos pra verificar quem é ou não é obrigatório. Isso pode gerar um trabalho a mais na hora de interpretar os campos na hora das querys (ok ok, um replace no nome e tá resolvido, mas whatever)...

Aqui em baixo um que fiz agorinha, que usa a classe do campo pra ver se ele é obrigatório ou não. Também pode te atrapalhar se você usa as classes pra aplicar estilo, mas é pra mostrar outra forma de se fazer.

<script>

function confereCampos(form) {    
    var campos = form.getElementsByTagName('input');
    var podeEnviar = true;
    for (i = 0; i < campos.length; i++) {
        var classe = campos[i].className;
        var valor = campos[i].value;
        if (classe == 'obrigatorio' && valor == '') podeEnviar = false;
    }
    if (podeEnviar == true) {
        return true;
    } else {
        alert('existem campos obrigatórios em branco!')
        return false;
    }
}
</script>
<form id='minhaForm' action='?TESTE' method='post' onSubmit='return confereCampos(this)'>

nome: <input type='text' id='nome' name='nome' value=''><br>
sobrenome: <input type='text' id='sobrenome' name='sobrenome' value='' class='obrigatorio'> obrigatório*<br>
<br>

<input type='submit' value='enviar' name='enviar'>

</form>

Detalhe: tanto no meu quanto no que tá no repositório, ninguém tá usando TRIM pra evitar que o cara digite umonte de espaços pra tentar burlar a obrigatoriedade dos campos... recomendo que você faça isso (trim = tirar os espaços do começo e final da string).

Detalhe2: O script pronto dá um alert pra cada campo vazio. O meu dá apenas um no final (mas o dele mostra quais são os campos).

A lógica é bem simples. Você pode trabalhar nos dois scripts pra criar um terceiro mais completo, de acordo com as suas necessidades.

;)

Editado por fiote
Link para o comentário
Compartilhar em outros sites

  • 0

if (podeEnviar == true) { // caso tudo esteja correto
        // insira aqui tudo o que você quer que seja feio ANTES do formulário ser enviado
        return true; 
}

Porém, vale lembrar que ao clicar no botão de enviar, o usuário será levado a uma nova página (a não ser que você esteja usando ajax, o que parece não ser o caso).

Seria melhor que o alert('Tudo certo!') ficasse na página-destino, e fosse enviado somente depois de inserir os dados no banco (ou sei lá o que você vai fazer com os dados heheh). Assim temos certeza certeeeeeza que realmente o pedido "foi enviado com êxito!".

Link para o comentário
Compartilhar em outros sites

  • 0

A uma nova página? A minha idéia inicial era que tudo fosse feito na página que esse form se situa e não ser levado a uma outra. Compreende?

Por exemplo, esse dados recuperados do formulário serão jogados a um email pré-definido via um engine ASP e no email aparecerá as informações certinhas. Ela vai para um email e não para o banco de dados.

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152k
    • Posts
      651,7k
×
×
  • Criar Novo...