Skip to content

Instantly share code, notes, and snippets.

@Khellem

Khellem/index.html

Created June 17, 2017 02:53
Show Gist options
  • Save Khellem/e2425171b30589fae1bc3bbd439d2af7 to your computer and use it in GitHub Desktop.
Save Khellem/e2425171b30589fae1bc3bbd439d2af7 to your computer and use it in GitHub Desktop.
Download ZIP
Validação de IE
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<title>Página Modelo</title>
<meta charset="utf-8">
<!-- Bootstrap CSS -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<!-- Bootstrap CSS -->
<link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css">
<!-- Meu CSS -->
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<form class="form-horizontal" action="#" enctype="multipart/form-data" method="post">
<fieldset>
<!-- Form Name -->
<legend>
<h1>CADASTRO DE DISTRIBUIDOR</h1>
</legend>
<div class="form-group">
<label for="cnpj" class="control-label col-sm-2">CNPJ</label>
<div class="col-sm-6">
<input type="text" class="form-control verCNPJ" name="cnpj" placeholder="Digite o CNPJ da sua empresa" required onblur="verificarCNPJ()">
<div id="alertaCNPJ"></div>
</div>
</div>
<div class="form-group">
<label for="razaoSocial" class="control-label col-sm-2">Razão Social</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="razaoSocial" placeholder="Digite a razão social da sua empresa" required>
</div>
</div>
<div class="form-group">
<label for="nomeFantasia" class="control-label col-sm-2">Nome Fantasia</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="nomeFantasia" placeholder="Digite o nome fantasia da sua empresa" required>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="ramoAtividade">Ramo de atividade</label>
<div class="controls text-left col-sm-6">
<select class="form-control" name="ramoAtividade" required>
<option value="1">Padaria</option>
<option value="2">Fábrica de bolos e afins</option>
<option value="3">Distribuidor de embalagens</option>
<option value="4">Representante de vendas</option>
<option value="5">Rede de supermercados</option>
<option value="6">Outro</option>
</select>
</div>
</div>
<div class="form-group">
<label for="cep" class="control-label col-sm-2">CEP</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="cep" placeholder="Digite o CEP da sua empresa" onblur="pesquisacep(this.value)" required>
</div>
</div>
<div class="form-group">
<label for="logradouro" class="control-label col-sm-2">Logradouro</label>
<div class="col-sm-5">
<input type="text" id="rua" class="form-control" name="logradouro" placeholder="Digite o logradouro da sua empresa" required>
</div>
<div class="col-sm-1">
<input type="text" class="form-control" name="numero" placeholder="Nº" required>
</div>
</div>
<div class="form-group">
<label for="complemento" class="control-label col-sm-2">Complemento</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="complemento" placeholder="Digite o complemento da sua empresa" required>
</div>
</div>
<div class="form-group">
<label for="bairro" class="control-label col-sm-2">Bairro</label>
<div class="col-sm-6">
<input type="text" id="bairro" class="form-control" name="bairro" placeholder="Digite o bairro da sua empresa" required>
</div>
</div>
<div class="form-group">
<label for="cidade" class="control-label col-sm-2">Cidade</label>
<div class="col-sm-6">
<input type="text" id="cidade" class="form-control" name="cidade" placeholder="Digite o município da sua empresa" required>
<input type="hidden" id="recebeUF" name="recebeUF">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="unFederativa">Estado</label>
<div class="controls text-left col-sm-6">
<select class="form-control" name="unFederativa" required id="ufSelect">
<option value="...">Selecione seu estado</option>
<option value="ac">Acre</option>
<option value="al">Alagoas</option>
<option value="am">Amazonas</option>
<option value="ap">Amapá</option>
<option value="ba">Bahia</option>
<option value="ce">Ceará</option>
<option value="df">Distrito Federal</option>
<option value="es">Espírito Santo</option>
<option value="go">Goiás</option>
<option value="ma">Maranhão</option>
<option value="mt">Mato Grosso</option>
<option value="ms">Mato Grosso do Sul</option>
<option value="mg">Minas Gerais</option>
<option value="pa">Pará</option>
<option value="pb">Paraíba</option>
<option value="pr">Paraná</option>
<option value="pe">Pernambuco</option>
<option value="pi">Piauí</option>
<option value="rj">Rio de Janeiro</option>
<option value="rn">Rio Grande do Norte</option>
<option value="ro">Rondônia</option>
<option value="rs">Rio Grande do Sul</option>
<option value="rr">Roraima</option>
<option value="sc">Santa Catarina</option>
<option value="se">Sergipe</option>
<option value="sp">São Paulo</option>
<option value="to">Tocantins</option>
</select>
</div>
</div>
<div class="form-group">
<label for="ie" class="control-label col-sm-2">Inscrição estadual</label>
<div class="col-sm-6">
<input type="text" class="form-control inscEstadual" name="ie" placeholder="Digite a inscrição estadual da sua empresa" onblur="validaIE()">
<div class="alertaIeInvalido"></div>
</div>
</div>
<div class="form-group">
<label for="responsavelCompras" class="control-label col-sm-2">Reponsável por compras</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="responsavelCompras" placeholder="Digite o seu nome" required>
</div>
</div>
<div class="form-group">
<label for="telefone" class="control-label col-sm-2">Telefone de contato</label>
<div class="col-sm-6">
<input type="tel" class="form-control telefoneDist" name="telefone" placeholder="Digite o telefone de contato da sua empresa" required>
</div>
</div>
<div class="form-group">
<label for="email" class="control-label col-sm-2">E-mail</label>
<div class="col-sm-6">
<input type="email" class="form-control" name="email" placeholder="Digite o email de contato" required>
</div>
</div>
<div class="form-group">
<label for="site" class="control-label col-sm-2">Site da empresa</label>
<div class="col-sm-6">
<input type="url" class="form-control" name="site" placeholder="Digite o site da empresa">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2"></label>
<div class="text-right col-sm-6">
<div id="cadastrarGroup" class="btn-group" role="group" aria-label="">
<button type="submit" name="cadastrar" name="cadastrar" class="btn btn-success" aria-label="Cadastrar">Cadastrar</button>
<button onclick="history.back()" type="button" name="cancelar" name="cancelar" class="btn btn-danger" aria-label="Cadastrar">Cancelar</button>
</div>
</div>
</div>
</fieldset>
</form>
<!-- Verificador da Insc Est -->
<script src="js/ie.min.js"></script>
<!-- Jquery Js 2.24 -->
<script src="js/jquery.min.js"></script>
<!-- Bootstrap Js -->
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- Js personalizado -->
<script src="js/script.js"></script>
</body>
</html>
Raw
script.js
function verificarCNPJ() {
var valorCNPJ = document.getElementsByName("cnpj")[0].value,
caixaErro = document.getElementById("alertaCNPJ"),
msgErro = "<span class='alert alert-danger'> O campo CNPJ não pode estar vazio!</span>";
if (valorCNPJ == "" || isNaN(valorCNPJ)==true){ // As barras || significam OU. Se for vazio OU se não for número.
caixaErro.innerHTML=msgErro;
}
else {
$('#alertaCNPJ').empty() // Limpa o alerta quando o campo for preenchido.
}
}
function validaIE() {
var ieDigitada = $('.inscEstadual').val(), // val = value
ufEscolhida = $('selected[name=unFederativa]').val(), // selected: a opção selecionada na função select, html.
msgErro = "<span class='alert alert-danger'> O campo CNPJ não pode estar vazio!</span>";
if(inscricaoEstadual(ieDigitada, ufEscolhida) == true){
alert ("Válido!");}
else {
alert ("Não válido!");}
if (inscricaoEstadual(ieDigitada, ufEscolhida) == "" || isNaN(inscricaoEstadual) == true){
caixaErro.innerHTML=msgErro;
}
else {
$('#alertaIeInvalido').empty()
$('#Válido').empty()
$('#Não Válido').empty()// Limpa o alerta quando o campo for preenchido.
}
}
// O cifrão $ chama PHP ou, neste caso, o jQuerry.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment