Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá, boa tarde a todos! Estou com uma pequena dúvida, eu uso Jquery Validation no meu formulário de contato, mais no meu formulário eu tenho uma caixa de escolha, ou seja; uma caixa SELECT. Gostaria de saber se há possibilidades de validar essa caixa! Vou explicar como.
Exemplo:
Tenho uma caixa de escolha no meu form que tem os seguiontes campos;
Opção0 - "Escolha uma sugestão" - Esse fica sempre visível antes do usuário escolher
Opção1 - Suporte
Opção2 - Sugestões
Opção3 - Vendas
Tipo, quero que o usuário seja obrigado a escolher uma dentre as opções de 1 a 3.
Segue abaixo o código JavaScript que estou utilizando, creio que seja nele que devo acrescentar.
<script type="text/javascript">
$(document).ready( function() {
$("#formularioContato").validate({
// Define as regras
rules:{
campoNome:{
// campoNome será obrigatorio (required) e terá tamanho minimo (minLength)
required: true, minlength: 2
},
campoEmail:{
// campoEmail será obrigatorio (required) e precisará ser um e-mail válido (email)
required: true, email: true
},
campoMensagem:{
// campoMensagem será obrigatorio (required) e terá tamanho minimo (minLength)
required: true, minlength: 2
}
},
// Define as mensagens de erro para cada regra
messages:{
campoNome:{
required: "Digite o seu nome!",
minlength: "O seu nome deve conter, no mínimo, 2 caracteres!"
},
campoEmail:{
required: "Digite o seu e-mail!",
email: "Digite um e-mail válido!"
},
campoMensagem:{
required: "Digite a sua mensagem!",
minlength: "A sua mensagem deve conter, no mínimo, 2 caracteres!"
}
}
});
});
</script>Fico agradecido a todos!Prezado William, eu sei que a codificação em java seria da mesma forma, mais o quero é que o usuário tenha que escolher uma das 3 opções (Suporte, sugestões ou venda), para evitar que a mensagem seja enviada sem a seleção no campo assunto. Tipo, não quero que o usuário permaneça com o assunto = "Escolha uma sugestão".
Eu já tentei da forma que você demonstrou mais não tive sucesso! Preciso de uma forma de que (ASSUNTO = ESCOLHA UMA SUGESTÃO) resulte em FALSO.
hum...
estamos programando em javascript, que não tem nada a ver com Java
você testou oque eu sugeri ?
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#form_teste").validate({
rules:{
assunto:{
required: true
}
},
messages:{
assunto:{
required: "Escolha um assunto!"
}
}
});
});
</script>
</head>
<body>
<form method="post" action="processa.php" id="form_teste">
<label>Assunto: <select name="assunto">
<option value="">Escolha uma sugestão</option>
<option value="Opcao1">Suporte</option>
<option value="Opcao2">Sugestões</option>
<option value="Opcao3">Vendas</option>
</select></label>
<label><input type="submit" name="enviar" value="enviar" /></label>
</form>
</body>
</html>veja que pelo **value**, ser igual a vazio "", o required do jquery.validate, não vai deixar você enviar o form, se a opção: 'Escolha uma sugestão', estiver selecionada.só isso.Prezado William, infelizmente não funcionou! Abaixo segue meu código.
Ha, ouve um equívoco na escrita do post anterior, eu quis dizer JavaScript mesmo!
<script type="text/javascript">
$(document).ready( function() {
$("#formularioContato").validate({
// Define as regras
rules:{
campoNome:{
// campoNome será obrigatorio (required) e terá tamanho minimo (minLength)
required: true, minlength: 2
},
campoEmail:{
// campoEmail será obrigatorio (required) e precisará ser um e-mail válido (email)
required: true, email: true
},
campoAssunto:{
//campoAssunto será obrigatorio (required) e tera que escolher uma (opção)
required: true
},
campoMensagem:{
// campoMensagem será obrigatorio (required) e terá tamanho minimo (minLength)
required: true, minlength: 2
}
},
// Define as mensagens de erro para cada regra
messages:{
campoNome:{
required: "Digite o seu nome!",
minlength: "O seu nome deve conter, no mínimo, 2 caracteres!"
},
campoAssunto:{
required: "Escolha um assunto!",
},
campoEmail:{
required: "Digite o seu e-mail!",
email: "Digite um e-mail válido!"
},
campoMensagem:{
required: "Digite a sua mensagem!",
minlength: "A sua mensagem deve conter, no mínimo, 2 caracteres!"
}
}
});
});
</script>Abaixo o meu campo SELECT.
<select name="campoAssunto">
<option value="">Selecione uma opção</option>
<option value="1">Dúvidas</option>
<option value="2">Sugestões</option>
<option value="3">Inscrição</option>
<option value="4">Publicidade / Divulgue a sua marca</option>
</select>hum... 'impossível' não ter funcionado.
Confira os caminhos para as libs jQuery.
coloque um link para o teu site.
Realmente fiquei surpreso com o não funcionamento! Mais já conferi tudo e está tudo ok! Mais também efetuei o teste com o modelo que você enviou no post anterior, e se você der uma analisada vai ver que ele não funcionou também! Não sei por que disso!
Vamos tentar diferente:
http://www.wbruno.com.br/scripts/valida_select.php
veja 'se aparece' o :
Escolha um assunto!
pois eu testei antes de postar, e funcionou sim.
Se não funcionar ai pra você, é alguma particularidade do teu navegador, qual você tá usando ?
>
Vamos tentar diferente:
http://www.wbruno.com.br/scripts/valida_select.php
veja 'se aparece' o :
Escolha um assunto!
pois eu testei antes de postar, e funcionou sim.
Se não funcionar ai pra você, é alguma particularidade do teu navegador, qual você tá usando ?
Poxa William realmente por esse link ae funcionou mesmo, aceite minhas desculpas, pode ser que seja meu navegador mesmo! É que estou no PC de onde eu trabalho, e meu navegador aqui é a droga do IE6. Vou fazer diferente agora, vou colocar o código JavaScript da validação do campo assunto separadamente dos outros.
Não cara.
Não tem nada de php ai. É apenas javascript.
Tudo bem, funciona no ie6 sim.
Logo, não é problema do navegador.
Mas sim alguma coisa que você fez errada. Veja de novo o código que postei, e procure o seu erro.
Se tiver dúvidas, poste um link online da sua tentativa.
>
Não cara.
Não tem nada de php ai. É apenas javascript.
Tudo bem, funciona no ie6 sim.
Logo, não é problema do navegador.
Mas sim alguma coisa que você fez errada. Veja de novo o código que postei, e procure o seu erro.
Se tiver dúvidas, poste um link online da sua tentativa.
Então por favor cara, me ajuda com esse FORM abaixo pois não sei mais o que fazer:
<html>
<head>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript"src="js/jquery.validate.js" ></script>
<style type="text/css"></style>
<script type="text/javascript">
$(document).ready(function() {
$("#form_teste").validate({
rules:{
campoNome:{
required: true, minlength: 2
},
campoEmail:{
required: true, email: true
},
campoAssunto:{
required: true
},
campoMensagem:{
required: true, minlength: 2
},
messages:{
campoNome:{
required: "Digite o seu nome!",
minlength: "O seu nome deve conter, no mínimo, 2 caracteres!"
},
campoEmail:{
required: "Digite o seu e-mail!",
email: "Digite um e-mail válido!"
},
campoAssunto:{
required: "Escolha um assunto!"
},
campoMensagem:{
required: "Digite a sua mensagem!",
minlength: "A sua mensagem deve conter, no mínimo, 2 caracteres!"
}
}
});
});
</script>
</head>
<body>
<form method="post" action="processa.php" id="form_teste">
<label><b>Nome:</b><br>
<input name="campoNome" type="text" id="name" size="40"></label><br>
<label><b>E-mail:</b><br>
<input name="campoEmail" type="text" id="email" size="40"></label><br>
<label><b>Assunto:</b><br>
<select name="campoAssunto">
<option value="">Escolha uma sugestão</option>
<option value="Opcao1">Suporte</option>
<option value="Opcao2">Sugestões</option>
<option value="Opcao3">Vendas</option>
</select>
</label>
<br>
<label><b>Anexar arquivo:</b><br>
<input type="file" name="campoArquivo" size="25"></label><br>
<label><b>Mensagem:</b><br>
<textarea name="campoMensagem" cols="35" rows="5"></textarea></label><br>
<label><input type="submit" name="enviar" value="enviar" /></label>
</form>
</body>
</html>vááários erros de sintaxe.
veja:
<html>
<head>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<style type="text/css">
* label { display: block; margin-top: 10px; font-weight: bold; }
label.error { float: none; color: red; margin: 0 .5em 0 0; vertical-align: top; font-size: 10px }
p { clear: both; }
.submit { margin-top: 1em; }
em { font-weight: bold; padding-right: 1em; vertical-align: top; }
</style>
<script type="text/javascript">
$(document).ready(function(){
$("#form_teste").validate({
rules:{
campoNome:{
required: true, minlength: 2
},
campoEmail:{
required: true, email: true
},
campoAssunto:{
required: true
},
campoMensagem:{
required: true, minlength: 2
}
},
messages:{
campoNome:{
required: "Digite o seu nome!",
minlength: "O seu nome deve conter, no mínimo, 2 caracteres!"
},
campoEmail:{
required: "Digite o seu e-mail!",
email: "Digite um e-mail válido!"
},
campoAssunto:{
required: "Escolha um assunto!"
},
campoMensagem:{
required: "Digite a sua mensagem!",
minlength: "A sua mensagem deve conter, no mínimo, 2 caracteres!"
}
}
});
});
</script>
</head>
<body>
<form method="post" action="processa.php" id="form_teste">
<label>Nome: <br />
<input name="campoNome" type="text" id="name" size="40"></label><br>
<label>E-mail:<br />
<input name="campoEmail" type="text" id="email" size="40"></label><br>
<label>Assunto:<br />
<select name="campoAssunto">
<option value="">Escolha uma sugestão</option>
<option value="Opcao1">Suporte</option>
<option value="Opcao2">Sugestões</option>
<option value="Opcao3">Vendas</option>
</select>
</label>
<br>
<label>Anexar arquivo:<br />
<input type="file" name="campoArquivo" size="25"></label><br>
<label>Mensagem:<br />
<textarea name="campoMensagem" cols="35" rows="5"></textarea></label><br>
<label><input type="submit" name="enviar" value="enviar" /></label>
</form>
</body>
</html>apenas arrume as pastas ali... colocando o js/indente melhor os teus códigos.Caraaaaaaa!!! Se você não moresse tão longe com certeza te pagaria uma caixa de cerveja!!! Valeu mesmo meu brother!!! Funcionou perfeitamente!!!
Me tira só mais uma dúvida! Como posso corrigir todo meu código HTML, tipo os erros de sintaxe! De uma maneira geral, existe algum programa?
hehe, única coisa que não bebo é cerveja... mas se for uma caixa de soda, 1 vodka, eu aceito por sedex :P
validador w3c
mas dos teus erros, o mais graves eram javascript...
apenas 'indentar corretamente' (ai você consegue ler o código mais fácil, e indentificar mais rápido erros)
Se bem, que o debug do Firefox é muito bom..
aperte
Ctrl + Shif + J
se tiver erros absurdos, ele vai te informar.
Poxa meu brother! Que pena que não bebes cervejas! Mais quando tiveres por Aracajú/SE manda a ideia, pago a Vodka e a Soda kkkkkkkkkk! E ainda te apresento umas gatas!!! kkkkkkkkk
Valeu mesmo!
Abraço!
[RESOLVIDO]
mesma coisa.. basta colocar pelo name, e garantir que a opção 'default' tenha value=""
campoMensagem:{
// campoMensagem será obrigatorio (required) e terá tamanho minimo (minLength)
required: true, minlength: 2
},
campoSelect:{
required: true
}
ai teu html, deve ser algo como: