Friends I'm trying to do a zip search using javascript, where am I going wrong?

Question

Friends I'm trying to do a zip search using javascript, where am I going wrong?

Navigation

#1 by (0 votes)

0

Javascript:

<script type="text/javascript" >

function limpa_formulário_cep() {
   //Limpa valores do formulário de cep.
   document.getElementById('endereco').value=("");
   document.getElementById('bairro').value=("");
   document.getElementById('cidade').value=("");
}

function meu_callback(conteudo) {
   if (!("erro" in conteudo)) {
      //Atualiza os campos com os valores.
      document.getElementById('endereco').value=(conteudo.logradouro);
      document.getElementById('bairro').value=(conteudo.bairro);
      document.getElementById('cidade').value=(conteudo.localidade);

   } //end if.
   else {
      //CEP não Encontrado.
      limpa_formulário_cep();
      alert("CEP não encontrado.");
   }
}

function pesquisacep(valor) {

   //Nova variável "cep" somente com dígitos.
   var cep = valor.replace(/\D/g, '');

   //Verifica se campo cep possui valor informado.
   if (cep != "") {

      //Expressão regular para validar o CEP.
      var validacep = /^[0-9]{8}$/;

      //Valida o formato do CEP.
      if(validacep.test(cep)) {

         //Preenche os campos com "..." enquanto consulta webservice.
         document.getElementById('endereco').value="...";
         document.getElementById('bairro').value="...";
         document.getElementById('cidade').value="...";

         //Cria um elemento javascript.
         var script = document.createElement('script');

         //Sincroniza com o callback.
         script.src = '//viacep.com.br/ws/'+ cep + '/json/?callback=meu_callback';

         //Insere script no documento e carrega o conteúdo.
         document.body.appendChild(script);

      } //end if.
      else {
         //cep é inválido.
         limpa_formulário_cep();
         alert("Formato de CEP inválido.");
      }
   } //end if.
   else {
      //cep sem valor, limpa formulário.
      limpa_formulário_cep();
   }
};
</script>

<script language="JavaScript">

 function mascara(t, mask){
     var i = t.value.length;
     var saida = mask.substring(1,0);
     var texto = mask.substring(i)
     if (texto.substring(0,1) != saida){
         t.value += texto.substring(0,1);
     }
 }
 </script>

HTML:

<form name="form" method="POST" action="insert.php">
   <div id="container">
      <a href="http://www.wysiwygwebbuilder.com" target="_blank"><img src="images/builtwithwwb12.png" alt="WYSIWYG Web Builder" style="position:absolute;left:89px;top:562px;border-width:0;z-index:250"></a>
   </div>
   <div id="wb_LayoutGrid1">
      <div id="LayoutGrid1">
         <div class="row">
            <div class="col-1">
               <div id="wb_Shape1" style="display:inline-block;width:763px;height:49px;z-index:0;position:relative;">
                  <img src="images/img0003.png" id="Shape1" alt="" style="width:763px;height:49px;">
               </div>
            </div>
            <div class="col-2">
               <hr id="Line1" style="display:block;width:100%;height:18px;z-index:1;">
               <div id="wb_Text1">
                  <span style="color:#FFFFFF;font-family:Tahoma;font-size:16px;"><strong>Seja Bem-Vindo!</strong></span>
               </div>
            </div>
            <div class="col-3">
               <hr id="Line3" style="display:block;width:100%;height:12px;z-index:3;">
               <input type="text" id="Editbox1" style="display:block;width:100%;height:26px;line-height:26px;z-index:4;" name="Editbox1" value="" spellcheck="false">
            </div>
         </div>
      </div>
   </div>
   <div id="wb_LayoutGrid2">
      <div id="LayoutGrid2">
         <div class="row">
            <div class="col-1">
            </div>
            <div class="col-2">
               <div id="wb_ResponsiveMenu1" style="display:inline-block;width:107px;height:53px;z-index:5;">
                  <label class="toggle" for="ResponsiveMenu1-submenu" id="ResponsiveMenu1-title">Menu<span id="ResponsiveMenu1-icon"><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span></label>
                  <input type="checkbox" id="ResponsiveMenu1-submenu">
                  <ul class="ResponsiveMenu1" id="ResponsiveMenu1">
                     <li><a href="#"><i class="fa fa-home fa-2x">&nbsp;</i><br>Home</a></li>
                  </ul>
               </div>
            </div>
            <div class="col-3">
            </div>
            <div class="col-4">
            </div>
            <div class="col-5">
            </div>
         </div>
      </div>
   </div>
   <div id="wb_LayoutGrid3">
      <div id="LayoutGrid3">
         <div class="row">
            <div class="col-1">
         </div>
         <div class="col-2">
            <hr id="Line2" style="display:block;width:100%;height:17px;z-index:28;">
            <div id="wb_Shape2" style="display:inline-block;width:249px;height:23px;z-index:29;position:relative;">
               <img src="images/img0004.png" id="Shape2" alt="" style="width:249px;height:23px;">
            </div>
            <hr id="Line4" style="display:block;width:100%;height:23px;z-index:30;">
            <div id="wb_LayoutGrid7">
               <div id="LayoutGrid7">
                  <div class="row">
                     <div class="col-1">
                        <input type="text" id="Editbox9" style="display:block;width:100%;height:49px;line-height:49px;z-index:6;" name="Editbox2" value="" disabled spellcheck="false" placeholder="Cadastre seu ve&#237;culo">
                     </div>
                  </div>
               </div>
            </div>
            <div id="wb_LayoutGrid4">
               <div id="LayoutGrid4">
                  <div class="row">
                     <div class="col-1">
                        <input type="text" id="Editbox2" style="display:block;width:100%;height:36px;line-height:36px;z-index:7;" name="Editbox2" value="" disabled spellcheck="false" placeholder="CPF*">
                        <input type="text" id="cpf" style="display:block;width:100%;height:29px;line-height:29px;z-index:8;" name="cpf" value="" autofocus spellcheck="false" maxlength="14" autofocus onkeypress="mascara(this, '###.###.###-##')">
                     </div>
                     <div class="col-2">
                        <input type="text" id="Editbox3" style="display:block;width:100%;height:36px;line-height:36px;z-index:9;" name="Editbox2" value="" disabled spellcheck="false" placeholder="Nome">
                        <input type="text" id="nome" style="display:block;width:100%;height:29px;line-height:29px;z-index:10;" name="nome" value="" spellcheck="false">
                     </div>
                  </div>
               </div>
            </div>
            <div id="wb_LayoutGrid6">
               <div id="LayoutGrid6">
                  <div class="row">
                     <div class="col-1">
                        <input type="text" id="Editbox10" style="display:block;width:100%;height:36px;line-height:36px;z-index:11;" name="Editbox2" value="" disabled spellcheck="false" placeholder="Email">
                     </div>
                     <div class="col-2">
                        <input type="text" id="Editbox4" style="display:block;width:100%;height:36px;line-height:36px;z-index:12;" name="Editbox2" value="" disabled spellcheck="false" placeholder="DDD">
                     </div>
                     <div class="col-3">
                        <input type="text" id="Editbox7" style="display:block;width:100%;height:36px;line-height:36px;z-index:13;" name="Editbox2" value="" disabled spellcheck="false" placeholder="Telefone">
                     </div>
                     <div class="col-4">
                        <input type="text" id="Editbox14" style="display:block;width:100%;height:36px;line-height:36px;z-index:14;" name="Editbox2" value="" disabled spellcheck="false" placeholder="CEP">
                     </div>
                  </div>
               </div>
            </div>
            <div id="wb_LayoutGrid5">
               <div id="LayoutGrid5">
                  <div class="row">
                     <div class="col-1">
                        <input type="text" id="email" style="display:block;width:100%;height:29px;line-height:29px;z-index:15;" name="email" value="" spellcheck="false">
                     </div>
                     <div class="col-2">
                        <input type="text" id="ddd" style="display:block;width:100%;height:29px;line-height:29px;z-index:16;" name="ddd" value="" spellcheck="false">
                     </div>
                     <div class="col-3">
                        <input type="text" id="telefone" style="display:block;width:100%;height:29px;line-height:29px;z-index:17;" name="telefone" value="" spellcheck="false" maxlength="9" onkeypress="mascara(this, '####-#####')">
                     </div>
                     <div class="col-4">
                        <input name="cep" type="text" id="cep" value="sddssd" size="10" maxlength="9" onblur="pesquisacep(this.value);" style="display:block;width:100%;height:29px;line-height:29px;z-index:18;">
                     </div>
                  </div>
               </div>
            </div>
            <div id="wb_LayoutGrid9">
               <div id="LayoutGrid9">
                  <div class="row">
                     <div class="col-1">
                        <input type="text" id="Editbox15" style="display:block;width:100%;height:36px;line-height:36px;z-index:19;" name="Editbox2" value="" disabled spellcheck="false" placeholder="Endere&#231;o">
                     </div>
                     <div class="col-2">
                        <input type="text" id="Editbox16" style="display:block;width:100%;height:36px;line-height:36px;z-index:20;" name="Editbox2" value="" disabled spellcheck="false" placeholder="Complemento">
                     </div>
                     <div class="col-3">
                        <input type="text" id="Editbox11" style="display:block;width:100%;height:36px;line-height:36px;z-index:21;" name="Editbox2" value="" disabled spellcheck="false" placeholder="Bairro">
                     </div>
                  </div>
               </div>
            </div>
            <div id="wb_LayoutGrid10">
               <div id="LayoutGrid10">
                  <div class="row">
                     <div class="col-1">
                        <input type="text" id="endereco" style="display:block;width:100%;height:29px;line-height:29px;z-index:22;" name="endereco" value="" spellcheck="false">
                     </div>
                     <div class="col-2">
                        <input type="text" id="complemento" style="display:block;width:100%;height:29px;line-height:29px;z-index:23;" name="complemento" value="" spellcheck="false">
                     </div>
                     <div class="col-3">
                        <input type="text" id="bairro" style="display:block;width:100%;height:29px;line-height:29px;z-index:24;" name="bairro" value="" spellcheck="false">
                     </div>
                  </div>
               </div>
            </div>
            <div id="wb_LayoutGrid11">
               <div id="LayoutGrid11">
                  <div class="row">
                     <div class="col-1">
                        <div id="wb_Checkbox1" style="display:inline-block;width:20px;height:20px;opacity:0.00;z-index:25;">
                           <input type="checkbox" id="Checkbox1" name="status" value="Inativo" checked style="display:inline-block;"><label for="Checkbox1"></label>
                        </div>
                     </div>
                     <div class="col-2">
                     </div>
                     <div class="col-3">
                        <hr id="Line5" style="display:block;width:100%;height:10px;z-index:26;">
                        <input type="submit" id="Button1" name="" value="ENVIAR" style="display:inline-block;width:60px;height:25px;z-index:27;">
                     </div>

php javascript

asked by anonymous 19.11.2017 / 00:19

1 answer

filter_input GET Problem importing github project with netbeans image

score 0 · Answer 1

The error is in 3 lines referring to a id cidade non existent in the code:

document.getElementById('cidade')...

When JavaScript, through document.getElementById , tries to get the value of an element or assign a value to an element that does not have the id specified, it results in the error below and the rest of the script is aborted: p>

Uncaught ReferenceError

Make sure your HTML needs this id or delete those JavaScript references.