Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Gostaria de fazer o seguinte;tenho esse select em meu site
<select name="areas" class="caixa" id="select3" onChange="mostraArea();"> <option value="----">-------</option> <option value="A Empresa">Apresentação da Empresa</option> <option value="Servicos">Serviços</option> <option value="Equipe">Equipe </option> <option value="Codigo de Etica">Código de Ética</option> <option value="Parceiros">Parceiros</option> <option value="Representantes Pangeia">Representantes</option> <option value="O que e Pangeia">O que é Pangéia </option> <option value="Atualizacao CEP">Atualização CEP</option> <option value="Links Importantes">Links Importantes</option> <option value="Central de Download">Central de Download</option> <option value="Area do Representante">Área do Representante</option> [COLOR=DarkBlue][B]<option value="Solicitacao Suporte">Solicitação de Suporte</option>[/B][/COLOR][COLOR=red][B] <option value="Solicitacao Orcamento">Solicitacao Orcamentos</option>[/B][/COLOR] <option value="Contatos">Contatos</option> <option value="Clientes">Clientes</option> <option value="Trabalhe Conosco">Venha Trabalhar Conosco</option></select>Gostaria de fazer com que se o usuario escolhe-se a opcao em destaque aparecesse um outro ListBox ao lado desse da seginte maneira...
<select name="areas" class="caixa" id="select3" onChange="mostraArea();"> <option value="----">-------</option> <option value="PRODUTO1">PRODUTO1</option> <option value="PRODUTO2">PRODUTO2</option> <option value="PRODUTO3">PRODUTO3</option> <option value="PRODUTO4">PRODUTO4</option> <option value="PRODUTO5">PRODUTO5</option></select>
tenho um codigo, aqui...mais nao consegui adequalo ao minha necessidade.
Aí cara.... montei um código aqui mais dinâmico... veja se rola! ;)
<html><head><title>Untitled Document</title></head><body><form id="frm1" name="frm1" action="" method="post"> <select onchange="redirect(this.options.selectedIndex,0);" name="opcoes"> <option selected>« Selecione uma das opções »</option> <option value="W">Letras Maiúsculas</option> <option value="--">Letras Minúsculas</option> <option value="2">Números (0 a 9)</option> </select> <select name="opcoes_outras" style='display: none;'> <option selected>**Selecione uma das opções**</option> </select><script language="JavaScript"><!--var groups = document.frm1.opcoes.options.length;var group = new Array(groups);for(i=0; i<groups; i++) group[i]=new Array();group[1][0] = new Option("A","A");group[1][1] = new Option("B","B");group[1][2] = new Option("C","C");group[1][3] = new Option("D","D");group[1][4] = new Option("E","E");group[1][5] = new Option("F","F");group[1][6] = new Option("G","G");group[1][7] = new Option("H","H");group[1][8] = new Option("I","I");group[1][9] = new Option("J","J");group[1][10] = new Option("K","K");group[1][11] = new Option("L","L");group[1][12] = new Option("M","M");group[1][13] = new Option("N","N");group[1][14] = new Option("O","O");group[1][15] = new Option("P","P");group[1][16] = new Option("Q","Q");group[1][17] = new Option("R","R");group[1][18] = new Option("S","S");group[1][19] = new Option("T","T");group[1][20] = new Option("U","U");group[1][21] = new Option("V","V");group[1][22] = new Option("W","W");group[1][23] = new Option("X","X");group[1][24] = new Option("Y","Y");group[1][25] = new Option("Z","Z");group[2][0] = new Option("","");group[3][0] = new Option("0","0");group[3][1] = new Option("1","1");group[3][2] = new Option("2","2");group[3][3] = new Option("3","3");group[3][4] = new Option("4","4");group[3][5] = new Option("5","5");group[3][6] = new Option("6","6");group[3][7] = new Option("7","7");group[3][8] = new Option("8","8");group[3][9] = new Option("9","9");var temp = document.frm1.opcoes_outras;function redirect(x,j) { if( x == 1 || x == 3 ) { temp.style.display = 'inline'; for(m=temp.options.length-1; m>0; m--) temp.options[m]=null; for(i=0; i<group[x].length; i++) temp.options[i]=new Option(group[x][i].text,group[x][i].value); temp.options[j].selected=true; } else { temp.style.display = 'none'; }}//--></script></form></body></html>FLOWWW!!!
mais, entao...cara..eu nao manjo muito de JS e to com essa difuculdade boba ae...sera que poderia me passar o codigo...se alguem puder agradeco ..
Show de bola...e isso mesmo...valeu mais uma vez...!!!!
se eu quiser recuperar valores desse ListBox Dinaminco...como eu faco...!!!
Da mesma forma!! Quando você cadastra um novo item no listbox (no new Option), você insere o nome do item e seu valor, respectivamente.Então, para fazer um teste, no segundo listbox (o dinÇamico) que vai abrir você coloca assim:
<select name="opcoes_outras" style='display: none;' onChange="alert(this.value);"><option selected>Selecione uma das opções</option></select>
Frmz? Aí você verá que funciona normalmente! ;) FLOWW!!!
Fala véi!! Frmz??
Faz tipo assim cara: Na sua função mostraArea();, passa como parâmetro o index de cada option (o famoso selectedIndex)! Assim:
... onChange="mostraArea(this.selectedIndex);">
Aí, na função, você só altera o display de cada listbox de acordo com a opção selecionada pelo usuário. Tipo:
Se opcao == 1 então
lista1.style.display = 'block'
Se não
Se opcao == 2 entao
lista2.style.display = 'block'
Mas antes de apresentar as listbox, esconde todas! ;)
Entendeu véi?
Ó... to preparando algo mais dinâmico e já te passo, frmz? ;)
FLOWWW!!!!