Erro combobox exibir.

[pinoc 2]

Seguinte pessoal, to mando um combobox exibir outro combobox, o segundo combobox a ser exibido exibi inputs dependendo oque for selecionado no mesmo. Mais esse segundo combo não exibi os inputs não sei porque pra min ta tudo certo o codigo. Alguem pode ajudar.

 

JS

 

function mostrar()
{
   if(document.getElementById('paginas').value == "Home")
   {
       document.getElementById('localhome').className = 'Home';
   }
else
{
	if(document.getElementById('paginas').value == "vantagem_socio")
	{
		document.getElementById('socio_home').className = 'vantagem_socio';
	}
	else
	{
		document.getElementById('socio_home').className = 'local';
	}
document.getElementById('localhome').className = 'local';
}
}

 

HTML

 

<div id="formularios">
	<form id="form" name="form" method="post" action="textos_act.php" enctype='multipart/form-data'>
		<div class="pagina">
              	<label>Pagina:</label>
				<select name="paginas" id="paginas" onchange="mostrar();" >
                   <option>Selecione a pagina</option>
                   <option value="Home">Home</option>
                   <option value="Diretoria">Diretoria</option>
                   <option value="Historia">História</option>
                   <option value="Representamos">Quem Representamos</option>
                   <option value="Informe">Informe Sitratuh</option>
                   <option value="Juridico">Juridico</option>
                   <option value="Convencoes">Convenções</option>
                   <option value="Recreativas">Atividades Recreativas</option>
                   <option value="Equipe">Cadastro de Equipe</option>
                   <option value="Atleta">Cadastro de Atleta</option>
                   <option value="Eventos">Eventos</option>
                   <option value="Convenios">Convênios</option>
                   <option value="Curriculos">Curriculos</option>
                   <option value="Coletivo">Acordo Coletivo</option>
                   <option value="Salarios">Salários em Vigor</option>
                   <option value="Contato">Contato</option>
			</select>
		</div>

         	<div class="local" id="localhome">
          		<label>Home:</label>
				<select name="localpagina[]" id="paginas" onchange="mostrar();">
                     	<option>Selecione</option>
                       <option value="vantagem_socio">Vantagens de ser Socio</option>
			</select>
	 	</div>

         	<div class="local" id="socio_home">
          	  <label for="vantagem">Vantagens de ser Socio</label>
           	<input type="text" name="socio_home[]" id="socio_home" />
               <input type="text" name="socio_home[]" id="socio_home" />
               <input type="text" name="socio_home[]" id="socio_home" />
               <input type="text" name="socio_home[]" id="socio_home" />
               <input type="text" name="socio_home[]" id="socio_home" />
               <input type="text" name="socio_home[]" id="socio_home" />
               <input type="text" name="socio_home[]" id="socio_home" />
         	</div>
         		<input type="submit" name="cadastrar" id="botao" value="Cadastrar" />  
  	  </form>
   </div>

[Vadio 13]

<p id="intro">Hello World!</p>
<p id="intro">Hello!</p>

<script>
x=document.getElementById("intro");
document.write("<p>innerHTML do elemento intro: " + x.innerHTML + "</p>");
</script>

 

id de um elemento é só para um elemento. perceba isso rodando o cod acima

 

utilize outro id no seu segundo elemento

 

crie 2 metodos mostra

 

"mostraComboMenu"

"mostraComboVantagem"

 

<!-- ... -->
<select name="paginas" id="menu" onchange="mostraComboMenu();" >
<!-- ... -->
<select name="localpagina[]" id="sub" onchange="mostraComboVantagem();">

[pinoc 2]

Entendi.

 

Porem pinto outro problema, quando eu quero mudar a seleção do combo 1 o que foi exibido pelo combo 2 não some, como faço para ele voltar para display none se eu alterar o combo 1

[Vadio 13]

na função acionada pelo combo 1 altere o display dos elementos q você deseja omitir

 

ex.:

   <script>
       function fazIsso(){
           document.getElementById('blocoASerOmitido').setAttribute('style','display: none;');
           //...
       }
   </script>
   <input onclick="fazIsso()" type="button" value="omitir" />
   <div id="blocoASerOmitido" style="display:block; ">conteúdo do bloco</div>

[pinoc 2]

Vadio Obrigado pela ajuda ;)

[pinoc 2]

ALGUM MODERADOR PODE ARRUMAR AS MINHAS RESPOSTAS ALI EM SIMA QUE DEU BUG.

 

Seguinte estava fazendo da forma que descrevi a sima e percebi que o codigo iria ficar gigante pois tenho varios combos no meu form, então fiz dinamico o primeiro combo manda as informações pro segundo combo. So que no segundo combo vo ter que exibir alguns inputs que estão ocultos, porem preciso fazer esses inputs voltarem a ficar oculto caso eu mude o primeiro combo que basicamente não tem nada a ver com a exibição dos inputs. Sera que deu de entender? Se alguam consegui me ajudar.

[Vadio 13]

?!?

 

oque voce quer fazer?

[pinoc 2]

Assim, Tenho Combo 1 e Combo 2, os dois estão sendo exibi o tempo todo fiz um sisteminha estilo estado e cidade, conforme a seleção do estado a cidade aparece, enfim isso esta funcionando perfeitamente.

 

Oque to fazendo é o seguinte o Combo 2 exibi uma div oculta dependendo oque for selecionado. (ISSO JÁ SEI FAZER)

 

Porem quando eu altero alguma coisa no combo 1 que consecutivamente altera o combo 2 ele não oculta a div que o combo 2 exibiu antes preciso fazer a div voltar a ficar oculta se o combo 1 for alterado. isso que não consegui fazer ainda.

[Vadio 13]

cria uma função assim

 

function esconder(id){
   var div = document.getElementById(id);
   if(div != undefined) div.setAttribute('style','display: none;');
   else div = false;

   return div;
}

 

daí na tua função sempre q foi acionada você limpa as divs

 

ex.:

function ComboUm(){

   if(!esconder('divX')) alert('div X não existe');
   if(!esconder('divY')) alert('div Y não existe');
   if(!esconder('divZ')) alert('div Z não existe');

   //...
}

 

resumindo

 

toda vez q a combo 1 sofrer alteração

 

a ação acionada deverá esconder as div's q não fazem parte do script

[pinoc 2]

Entendi, mais preciso adicionar algo no combo 1 para executar?

 

Não testei aqui ainda deu pal no meu pc tive que formata, to instalando tudo. :/

[Vadio 13]

pode ser na própria função de onchange/onblur q você esta utilizando para atualizar o combo2

 

antes de dar o load você tem q fecha todas as outras..

[pinoc 2]

Cara desculpa minha ignorancia, mais js é uma parada que não consigu enfiar na cabeça.

 

A função de atulizar o combo 2 conforme alterações no combo 1 esta assim fora a pagina externa que tem, não tenho nada no html puxando isso pois ta puxando pelo ID ali. Como eu faria para add aquela função sua?

 

<script type="text/javascript">
   window.onload = function() {	
       new dgCidadesEstados( 
           document.getElementById('estado'), 
           document.getElementById('cidade'), 
           true
       );
   }
</script>

[Vadio 13]

tem q add ele dentro do objeto

 

dgCidadesEstados

 

 

posta essa função ae

[pinoc 2]

Vadio mudei dgCidadesEstados para paginalocal

 

window.onDomReady = function dgDomReady(fn){
if(document.addEventListener)	//W3C
	document.addEventListener("DOMContentLoaded", fn, false);
else //IE
	document.onreadystatechange = function(){dgReadyState(fn);}
}

function dgReadyState(fn){ //dom is ready for interaction (IE)
if(document.readyState == "interactive") fn();
}

/* Objeto */
paginalocal = function(local,pagina,init) {
 this.set(local,pagina);
 if (init) this.start();
}

paginalocal.prototype = {
 pagina: document.createElement('select'),
 local: document.createElement('select'),
 set: function(pagina, local) {
   this.pagina=pagina;
   this.pagina.paginalocal=this
   this.local=local;
   this.pagina.onchange=function(){this.paginalocal.run()};
 },
 run: function () {
   var sel = this.pagina.options.selectedIndex;
   var itens = this.locais[sel];
   var itens_total = itens.length;
   var opts = this.local;
   while (opts.childNodes.length)
     opts.removeChild(opts.firstChild);
   this.addOption(opts, '', 'Selecione um Local');
   for (var i=0;i<itens_total;i++)
     this.addOption(opts, itens[i], itens[i]);
 },
 start: function () {
   var pagina = this.pagina
   while (pagina.childNodes.length)
     pagina.removeChild(pagina.firstChild);
   for (var i=0;i<this.paginas.length;i++)
     this.addOption(pagina, this.paginas[i][0], this.paginas[i][1]);
 },
 addOption: function (elm, val, text) {
   var opt = document.createElement('option');
   opt.appendChild(document.createTextNode(text));
   opt.value = val;
   elm.appendChild(opt);
 },
 paginas : [
   ['','Selecione uma Pagina'],['Home','Home'],['Diretoria','Diretoria'],['Historia','História'],['Quem Representamos','Quem Representamos'],['Informe Sitratuh','Informe Sitratuh'],['Juridico','Juridico'],['Convencoes','Convenções'],['Atividades Recreativas','Atividades Recreativas'],['Cadastro de Equipe','Cadastro de Equipe'],['Cadastro de Atleta','Cadastro de Atleta'],['Eventos','Eventos'],['Convenios','Convênios'],['Curriculos','Curriculos'],['Acordo Coletivo','Acordo Coletivo'],['Salarios em Vigor','Salários em Vigor'],['Contato','Contato']
 ],
 locais : [[
   ], ['Vantagens de ser socio',],['Texto principal diretoria','Adicionar membro'],['Texto principal historia'],['Texto principal representamos','Texto representado'],['Texto principal informe','Adcionar informe'],['Texto Principal juridico','Adcionar texto explicativo juridico'],['Texto principal convencoes','Adicionar categoria de convencoes','Adcionar convencao','Texto principal contribuicoes','Adicionar texto contribuicoes'],['Texto principal recreativas'],['Texto principal equipe'],['Texto principal atleta'],['Texto principal eventos'],['Texto principal convenios','Adicionar texto explicacao convenios'],['Texto principal curriculos','Adicionar categoria de curriculum','Adicionar curriculum'],['Texto principal acordo','Adcionar texto acordo'],['Texto principal salarcio','Adicionar categoria salario','Adicionar salario'],['Texto Principal','E-mail','Enderecos.']
 ]
};

[Vadio 13]

dentro do método run você limpa as divs q você quer

[pinoc 2]

Cara ve se fiz certo, pois não funciono, e inclusive deu erro no que ja estava funcionando.

 

 run: function () {

var div = document.getElementById(local);
   if(div != undefined) div.setAttribute('style','display: none;');
   else div = false;
   return div;

   var sel = this.pagina.options.selectedIndex;
   var itens = this.locais[sel];
   var itens_total = itens.length;
   var opts = this.local;
   while (opts.childNodes.length)
     opts.removeChild(opts.firstChild);
   this.addOption(opts, '', 'Selecione um Local');
   for (var i=0;i<itens_total;i++)
     this.addOption(opts, itens[i], itens[i]);

[Vadio 13]

var div = document.getElementById(this.local);

 

 

sua idéia é esconder a div ou deletar o conteúdo do campo cidades?

 

aquele return tbm não deveria estar ali..

 

você q criou esse objeto ?

 

oque você pretende fazer com ele especificamente?

 

por exemplo

 

pq você não cria um objeto

 

estado

q vai ter o metodo buscar estados

ira retornar um array json contendo id, estado

 

o metodo popula combobox

q vai utilizar o array json para popular o combo

 

e o metodo destroyNode

q vai zerar o combo

 

esse objeto só irá receber o nó do select onde as opções serão armazenadas (o nó q será populado pelo objeto)

 

outro cidade

vai ter os mesmos metodos do objeto acima

mas será utilizado dentro de um event criado no

 

ou

 

dai você ia ter algo assim

var comboEstado = new Estado('idComboBox');
comboEstado.popula();

var comboCidade = new Cidade('idComboCidade');
$('idComboBox option').click(function(){
   comboCidade.destroyChildNodes();
   comboCidade.popula();

   $('idComboCidade option').click(function(){
       comboCidade.destroyChildNodes();
       comboCidade.popula()
   });
});

$('button#zerarEstado');click(function(){
   comboEstado.destroyChildNodes();
})

 

oq ia te facilitar um pouco mas vai te dar mais trabalho contudo o resultado será ótimo.

[pinoc 2]

Então cara, pelo que percebi no meu sistema aqui (esse sistema de atualizar um combo referente ao outro achei na net)

o combo 2 que to fazendo exibir a div que esta oculta faz a div ficar oculta denovo se eu mudar a seleção dele para nada, resumindo acredtio que fazendo o combo 1 limpar o combo 2 antes de fazer aparecer o conteudo nele deva funcionar.