Ir para conteúdo

POWERED BY:

Arquivado

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

dinohills

[Resolvido] Mudar valor de select dentro da tabela especificada

Recommended Posts

Boa tarde,

Estou tentando montar um script que ao escolher uma opção na lista primaria(select) ele mude o valor das demais listas(select) que estão dentro da tabela.

Estou tentando definir isso pegando a id da tabela e fazendo com que ele mude o valor das listas que estão dentro da tabela que foi especificada.

 

O script me retorna o seguinte erro:

tabela.getElementsByName is not a function

 

O problema é que eu preciso manter os nomes das listas(select) tanto da tabela 1 como da tabela 2 iguais.

Tem como restringir isso pegando o id da tabela e mandando alterar so dentro dela ?

 

Exemplo que montei:

<html>
   <head>
       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
           <title></title>
           <script type="text/javascript">
               function muda_lista(id_tabela,id_lista,nome_lista){
                   var tabela = document.getElementById(id_tabela);
                   var lista_principal  = document.getElementById(id_lista);
                   var listas = tabela.getElementsByName(nome_lista);

                   for(i=0;i<listas.length;i++){
                       listas[i].value = lista_principal.value;
                   }

               }
           </script>
   </head>
   <body>
       <table border="1" id="tabela1">
           <thead>
               <tr>
                   <th>
                       Tabela 1<br/>
                       <select id="lista_principal1" onchange="muda_lista('tabela1','lista_principal1','lista')">
                           <option value="A">A</option>
                           <option value="B">B</option>
                           <option value="C">C</option>
                       </select>
                   </th>
               </tr>
           </thead>
           <tbody>
               <tr>
                   <td>
                       <select name="lista">
                           <option value="A">A</option>
                           <option value="B">B</option>
                           <option value="C">C</option>
                       </select>
                   </td>
               </tr>
               <tr>
                   <td>
                       <select name="lista">
                           <option value="A">A</option>
                           <option value="B">B</option>
                           <option value="C">C</option>
                       </select>
                   </td>
               </tr>
               <tr>
                   <td>
                       <select name="lista">
                           <option value="A">A</option>
                           <option value="B">B</option>
                           <option value="C">C</option>
                       </select>
                   </td>
               </tr>
           </tbody>
       </table>
       <br/>
       <table border="1" id="tabela2">
           <thead>
               <tr>
                   <th>
                       Tabela 1<br/>
                       <select id="lista_principal2" onchange="muda_lista('tabela2','lista_principal2','lista')">
                           <option value="A">A</option>
                           <option value="B">B</option>
                           <option value="C">C</option>
                       </select>
                   </th>
               </tr>
           </thead>
           <tbody>
               <tr>
                   <td>
                       <select name="lista">
                           <option value="A">A</option>
                           <option value="B">B</option>
                           <option value="C">C</option>
                       </select>
                   </td>
               </tr>
               <tr>
                   <td>
                       <select name="lista">
                           <option value="A">A</option>
                           <option value="B">B</option>
                           <option value="C">C</option>
                       </select>
                   </td>
               </tr>
               <tr>
                   <td>
                       <select name="lista">
                           <option value="A">A</option>
                           <option value="B">B</option>
                           <option value="C">C</option>
                       </select>
                   </td>
               </tr>
           </tbody>
       </table>
   </body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

cara... oque você acha de trocar o byName por um byTagName ?

 

                    var listas = tabela.getElementsByTagName('select');

 

 

fez oque você quer, eu acho.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Deu certo trocando para ByTagName.

Obrigado !

 

Agora você sabe o porque de não dar certo pegando pelo nome do campo ?

 

Eu pensei um modo aqui, só não testei ainda. Vo tentar explicar o modo que pensei.

 

 

E se eu pegasse a quantidade de inputs com o nome especificado de cada tabela e mandasse o script alterar o valor da

lista0 ate lista2 da tabela1

e

lista3 ate lista5 da tabel2

 

Seria possível ?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Creio que getElementsByName seja uma função do objeto document, e não uma função de qualquer nó, assim como é a getElementsByTagName.

 

 

Então a ByName, tem q sempre ser chamada apartir de document. Por isso deu o seu erro.

 

 

 

Cara, desnecessário e confuso você fazer assim ne?! Deixa pegando todos os filhos daquele pai.. assim se você incluir mais um campo, ou excluir, não precisa modificar o js.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Cara, desnecessário e confuso você fazer assim ne?!

 

Bom na minha cabeça não me pareceu confuso ahahahah. Mas tudo bem, já deu certo o que eu queria fazer aqui.

Obrigado mais uma vez!!!

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.