Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

walterwac

[Resolvido] função

Recommended Posts

Olá, estou estudando e construindo dois combobox(Estado e municipio) que após realizar as sua listagem, eu possa adicionar mais tarde em um textbox.

 

Acredito que eu precise contruir uma função em javascript.

 

Alguem poderia me dar exemplos de como realizar tal procedimento?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Complicado montarmos exemplos, pq tb temos nossos proprios trabalhso para entregar.

 

tente fazer e poste conforme tiver dúvidas, q vamos tentar te ajudar.

para colocar na textbox, você precisa atribuir oq você quer ao atributo .value do elemento.

Compartilhar este post


Link para o post
Compartilhar em outros sites

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/url]">
<html xmlns="[url="http://www.w3.org/1999/xhtml"]http://www.w3.org/1999/xhtml[/url]">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>

<script type="text/javascript">

     $(document).ready(function(){

        $("select[name=estado]").change(function(){
           $("select[name=cidade]").html('<option value="0">Carregando...</option>');

           $.post("cidades.php", 
                 {estado:$(this).val()},
                 function(valor){
                    $("select[name=cidade]").html(valor);
                 }
                 )

        })
     })

</script>
<script type="text/javascript">
function CBtoTB()
{
document.getElementById("TextBox").value=document.getElementById("ComboBox").value
}
</script>
</head>

<body>
<form action="" method="post">
  <p>
    <select name="estado" id="ComboBox" onchange="CBtoTB">
      <option value="0">Escolha um Estado</option>
      <?php

        mysql_connect("localhost", "root", "");
        mysql_select_db("loja");

        $sql = "SELECT * FROM tb_estados ORDER BY nome ASC";
        $qr = mysql_query($sql) or die(mysql_error());
        while($ln = mysql_fetch_assoc($qr)){
           echo '<option value="'.$ln['id'].'">'.$ln['nome'].'</option>';
        }
     ?>

    </select>

    <select name="cidade" id="" onchange="CBtoTB">
      <option value="0" disabled="disabled">Escolha um Estado Primeiro</option>
    </select>
    <br />
  </p>
  <p>
    <textarea cols="60" rows="10" id="TextBox"></textarea>
  </p>
</form>
</body>
</html>

 

 

 

 

 

 

 

 

<script type="text/javascript">
function CBtoTB()
{
document.getElementById("TextBox").value=document.getElementById("ComboBox").value
}
</script>

< /head>

 

 

Até onde pesquisei..., esta função realizaria o que eu preciso, mas não funcionou não!

Compartilhar este post


Link para o post
Compartilhar em outros sites

coloca aqui:

 

            
        });
        CBtoTB();
     });

 

e

<select name="estado" id="ComboBox">

Compartilhar este post


Link para o post
Compartilhar em outros sites

Altere esses respectivos trechos do seu script, para o que mostrei.

Compartilhar este post


Link para o post
Compartilhar em outros sites

como ficou ?

 

aparece algum erro no console?

leitura:

http://wbruno.com.br/blog/2011/03/31/como-debugar-javascript-firefox-erros-comuns/

Compartilhar este post


Link para o post
Compartilhar em outros sites

Consegui selecionar o combobox estado mais o municipio e exibir via alert javascript c/ DOM os elementos na tela.

 

Acho que o estudo esta voltado para DOM e seus elementos, algo como document.add no javascript. Caso alguem possa me dar uma dica agradeço, pois por hora continuo estudando.

 

Veja o código com nova função!


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/url]">
<html xmlns="[url="http://www.w3.org/1999/xhtml"]http://www.w3.org/1999/xhtml[/url]">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>

<script type="text/javascript">

     $(document).ready(function(){

        $("select[name=estado]").change(function(){
           $("select[name=cidade]").html('<option value="0">Carregando...</option>');

           $.post("cidades.php", 
                 {estado:$(this).val()},
                 function(valor){
                    $("select[name=cidade]").html(valor);
                 }
                 )

        })
     })

</script>
<script type="text/javascript">
//function CBtoTB()

// {
//document.getElementById("TextBox").value=document.getElementById("ComboBox").value

//}

   function informar(){   
     var i = document.form.estado.selectedIndex; 
  var h = document.form.cidade.selectedIndex; 

 alert(document.form.estado[i].text+' - '+document.form.cidade[h].text);   

   }   

</script>
</head>

<body>
<form  name="form" action="" method="post">
<select name="estado">
 <option value="0">Escolha um Estado</option>
 <?php

        mysql_connect("localhost", "root", "");
        mysql_select_db("loja");

        $sql = "SELECT * FROM tb_estados ORDER BY uf ASC";
        $qr = mysql_query($sql) or die(mysql_error());
        while($ln = mysql_fetch_assoc($qr)){
           echo '<option value="'.$ln['id'].'">'.$ln['uf'].'</option>';
        }
     ?>

</select>

<select name="cidade">
 <option value="0" disabled="disabled">Escolha um Estado Primeiro</option>
</select>
<input type="button"  value="Ler" onclick="informar()"/>
<br />

  <p>
    <textarea  cols="60" rows="10" "></textarea>
  </p>
  <p> </p>
</form>
</body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Funciona!

 

 

 

<script type="text/javascript">

 

function preencher(){

//Cria indice

est = document.form.estado.selectedIndex;

mun = document.form.cidade.selectedIndex;

 

//Concatenação dos vetores, input e output

sel= (document.form.estado[est].text+' - '+document.form.cidade[mun].text);

inp = document.form.placa.value;

out = document.form.area.value;

document.form.area.value = out + sel +' - '+ inp + "\n";

 

//Limpa os campos

document.form.placa.value = "";

document.form.estado.value = "";

document.form.cidade.value = "";

 

 

}

 

</script>

 

 

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.