Minha function não funciona
17/07/2019
0
Quero fazer uma function pra checar se os campos estão preenchidos e estou batendo a cabeça nisso.
Segue
Segue
<html>
<head>
<title>Formulário</title>
<meta charset="utf-8">
<script language="javascript" type="text/javascript">
function ChecarCampos() {
var nome = document.form.nome;
var snome = document.form.snome;
var email = document.form.email;
var emailconfirma = document.form.emailconfirma;
var telefone = document.form.telefone;
var cidade = document.form.cidade;
var erro = "";
var count = 0;
if (nome.value == "")
{
erro += "\\nPreencha o campo nome";
count = count + 1
}
if (snome.value == "")
{
erro += "\\nPreencha o campo sobrenome";
count += 1
}
if (email.value == "")
{
erro += "\\nPreencha o campo e-mail";
count = count + 1
}
if (emailconfirma.value = "")
{
erro += "\\nPreencha o campo confirma e=mail";
count += 1
}
if (telefone.value == "")
{
erro += "\\nPreencha o campo telefone";
count += 1
}
if (cidade.value == "")
{
erro += "\\nPreencha o campo cidade";
count += 1
}
if (count > 0)
{
alert("Os seguintes erros foram encontrador:\\n" + erro);
return false
}
}
</script>
</head>
<body>
<style type="text/css">
.fieldset {
border: 0;
}
.body, .input, .select, .textarea, .button {
font-family: sans-serif;
font-size: 1em;
}
.grupo:before, .grupo:after {
content: " ";
display: table;
}
.grupo:after {
clear: both;
}
.campo {
margin-bottom: 1em;
}
.campo label {
margin-bottom: 0.2em;
color: #666;
display: block;
}
.grupo .campo {
float: left;
margin-right: 1em;
}
.campo input[type="text"], .campo .input[type="email"], .campo .input[type="url"],
.campo input[type="tel"], .campo .select, .campo .textarea {
padding: 0.2em;
border: 1px solid #CCC;
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
display: block;
}
.campo .select .option {
padding-right: 1em;
}
.campo .input:focus, .campo .select:focus, .campo .textarea:focus {
background: #FFC;
}
.campo .label.checkbox {
color: #000;
display: inline-block;
margin-right: 4em;
}
</style>
</head>
<body>
</script>
<form action="" method="post">
<fieldset class="grupo">
<legend><h1>Formulário de Cadastro</h1></legend>
<div class="campo">
<label for="nome">Nome</label> <input type="text"
placeholder="Digite seu nome" id="nome" name="nome"
style="width: 10em" value="">
</div>
<div class="campo">
<label for="snome">Sobrenome</label> <input type="text"
placeholder="Último nome" id="snome" name="snome"
style="width: 10em" value="">
</div>
</fieldset>
<fieldset>
<div class="campo">
<label>Sexo</label>Masculino<label> <input type="radio" name="sexo"
value="masculino">
</label>Feminino<label> <input type="radio" name="sexo" value="feminino"></fieldset>
<fieldset>
</div>
<div class="campo">
<label for="email">E-mail</label> <input type="text"
placeholder="Digite seu e-mail" id="email" name="email"
style="width: 20em" >
</div>
<div class="campo">
<label for="emailconfirma">Confirme e-mail</label> <input type="text"
placeholder="Digite novamente seu e-mail" id="emailconfirma" name="emailconfirmar"
style="width: 20em">
</div>
</fieldset>
<fieldset>
<div class="campo">
<label for="telefone">Telefone</label> <input type="text"
placeholder="Digite seu telefone" id="telefone" name="telefone"
maxlength="11" style="width: 10em" value="">
</div>
</fieldset>
<fieldset class="grupo">
<div class="campo">
<label for="cidade">Cidade</label> <input type="text"
placeholder="Digite sua cidade" id="cidade" name="cidade"
style="width: 10em" value="">
</div>
</fieldset>
<fieldset>
<div class="campo">
<label for="estado">Estado</label> <select id="estado"
name="estado">
<option value="AC">AC</option>
<option value="AL">AL</option>
<option value="AP">AP</option>
<option value="AM">AM</option>
<option value="BA">BA</option>
<option value="CE">CE</option>
<option value="DF">DF</option>
<option value="ES">ES</option>
<option value="GO">GO</option>
<option value="MA">MA</option>
<option value="MT">MG</option>
<option value="MS">MS</option>
<option value="MG">MG</option>
<option value="PA">PA</option>
<option value="PB">PB</option>
<option value="PR">PR</option>
<option value="PE">PE</option>
<option value="PI">PI</option>
<option value="RJ">RJ</option>
<option value="RN">RN</option>
<option value="RS">RS</option>
<option value="RO">RO</option>
<option value="RR">RR</option>
<option value="SC">SC</option>
<option value="SP">SP</option>
<option value="SE">SE</option>
<option value="TO">TO</option>
<option value="EX">Estrangeiro</option>
</select> </select>
</div>
</fieldset>
<fieldset>
<div class="campo">
<label for="mensagem">Mensagem</label><sup>Opcional</sup>
<textarea rows="6" placeholder="Digite aqui sua mensagem"
style="width: 20em" id="mensagem" maxlength="100" name="mensagem"></textarea>
</div>
</fieldset>
<fieldset>
<div class="campo">
<label> <input type="checkbox" name="novidades" value="1">
Gostaria de receber novidades em meu e-mail.
</label>
</div>
</fieldset>
<br>
<div class="testbutton">
<center>
<input type=submit value="Cadastrar" onclick="ChecarCampos();">
</center>
</div>
</fieldset>
</form>
</body>
</html>
Felipe Moreno
Curtir tópico
+ 0
Responder
Posts
17/07/2019
Jothaz
function ChecarCampos() {
var erro = "";
bool temErro = false
if (document.getElementById('nome').value == "")
{
erro += "\\\\nPreencha o campo nome";
temErro = true
}
if (document.getElementById('snome').value == "")
{
erro += "\\\\nPreencha o campo sobrenome";
temErro = true
}
if (temErro)
{
alert("Os seguintes erros foram encontrador:\\\\n" + erro);
return false
}
}
Responder
17/07/2019
Felipe Moreno
function ChecarCampos() {
var erro = "";
bool temErro = false
if (document.getElementById('nome').value == "")
{
erro += "\\\\\\\\nPreencha o campo nome";
temErro = true
}
if (document.getElementById('snome').value == "")
{
erro += "\\\\\\\\nPreencha o campo sobrenome";
temErro = true
}
if (temErro)
{
alert("Os seguintes erros foram encontrador:\\\\\\\\n" + erro);
return false
}
}Obrigado pela atenção amigo, mas continua não aparecendo nada quando apertao meu botão, vou tentar mais um pouco aqui, obrigado cara, tenha uma boa tarde!!
Responder
17/07/2019
Jothaz
Foi mal não vi o erro. Coloque sua tag script dentro da tag <HEAD> depois da tag <STYLE>.
Ou pode colocar no final, mas dentro da tag <BODY> antes de </BODY>.
Ou pode colocar no final, mas dentro da tag <BODY> antes de </BODY>.
<html>
<head>
<title>Formulário</title>
<meta charset="utf-8">
</head>
<body>
<style type="text/css">
.fieldset {
border: 0;
}
.body, .input, .select, .textarea, .button {
font-family: sans-serif;
font-size: 1em;
}
.grupo:before, .grupo:after {
content: " ";
display: table;
}
.grupo:after {
clear: both;
}
.campo {
margin-bottom: 1em;
}
.campo label {
margin-bottom: 0.2em;
color: #666;
display: block;
}
.grupo .campo {
float: left;
margin-right: 1em;
}
.campo input[type="text"], .campo .input[type="email"], .campo .input[type="url"],
.campo input[type="tel"], .campo .select, .campo .textarea {
padding: 0.2em;
border: 1px solid #CCC;
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
display: block;
}
.campo .select .option {
padding-right: 1em;
}
.campo .input:focus, .campo .select:focus, .campo .textarea:focus {
background: #FFC;
}
.campo .label.checkbox {
color: #000;
display: inline-block;
margin-right: 4em;
}
</style>
<script language="javascript" type="text/javascript">
function ChecarCampos() {
var erro = "";
var temErro = false;
if (document.getElementById('nome').value == "")
{
erro += "\\\\\\\\nPreencha o campo nome";
temErro = true
}
if (document.getElementById('snome').value == "")
{
erro += "\\\\\\\\nPreencha o campo sobrenome";
temErro = true
}
if (temErro)
{
alert("Os seguintes erros foram encontrador:\\\\\\\\n" + erro);
return false
}
</script>
</head>
<body>
</script>
<form action="" method="post">
<fieldset class="grupo">
<legend><h1>Formulário de Cadastro</h1></legend>
<div class="campo">
<label for="nome">Nome</label> <input type="text"
placeholder="Digite seu nome" id="nome" name="nome"
style="width: 10em" value="">
</div>
<div class="campo">
<label for="snome">Sobrenome</label> <input type="text"
placeholder="Último nome" id="snome" name="snome"
style="width: 10em" value="">
</div>
</fieldset>
<fieldset>
<div class="campo">
<label>Sexo</label>Masculino<label> <input type="radio" name="sexo"
value="masculino">
</label>Feminino<label> <input type="radio" name="sexo" value="feminino"></fieldset>
<fieldset>
</div>
<div class="campo">
<label for="email">E-mail</label> <input type="text"
placeholder="Digite seu e-mail" id="email" name="email"
style="width: 20em" >
</div>
<div class="campo">
<label for="emailconfirma">Confirme e-mail</label> <input type="text"
placeholder="Digite novamente seu e-mail" id="emailconfirma" name="emailconfirmar"
style="width: 20em">
</div>
</fieldset>
<fieldset>
<div class="campo">
<label for="telefone">Telefone</label> <input type="text"
placeholder="Digite seu telefone" id="telefone" name="telefone"
maxlength="11" style="width: 10em" value="">
</div>
</fieldset>
<fieldset class="grupo">
<div class="campo">
<label for="cidade">Cidade</label> <input type="text"
placeholder="Digite sua cidade" id="cidade" name="cidade"
style="width: 10em" value="">
</div>
</fieldset>
<fieldset>
<div class="campo">
<label for="estado">Estado</label> <select id="estado"
name="estado">
<option value="AC">AC</option>
<option value="AL">AL</option>
<option value="AP">AP</option>
<option value="AM">AM</option>
<option value="BA">BA</option>
<option value="CE">CE</option>
<option value="DF">DF</option>
<option value="ES">ES</option>
<option value="GO">GO</option>
<option value="MA">MA</option>
<option value="MT">MG</option>
<option value="MS">MS</option>
<option value="MG">MG</option>
<option value="PA">PA</option>
<option value="PB">PB</option>
<option value="PR">PR</option>
<option value="PE">PE</option>
<option value="PI">PI</option>
<option value="RJ">RJ</option>
<option value="RN">RN</option>
<option value="RS">RS</option>
<option value="RO">RO</option>
<option value="RR">RR</option>
<option value="SC">SC</option>
<option value="SP">SP</option>
<option value="SE">SE</option>
<option value="TO">TO</option>
<option value="EX">Estrangeiro</option>
</select> </select>
</div>
</fieldset>
<fieldset>
<div class="campo">
<label for="mensagem">Mensagem</label><sup>Opcional</sup>
<textarea rows="6" placeholder="Digite aqui sua mensagem"
style="width: 20em" id="mensagem" maxlength="100" name="mensagem"></textarea>
</div>
</fieldset>
<fieldset>
<div class="campo">
<label> <input type="checkbox" name="novidades" value="1">
Gostaria de receber novidades em meu e-mail.
</label>
</div>
</fieldset>
<br>
<div class="testbutton">
<center>
<input type=submit value="Cadastrar" onclick="ChecarCampos();">
</center>
</div>
</fieldset>
</form>
</body>
</html>
Responder
Clique aqui para fazer login e interagir na Comunidade :)