Ir para conteúdo
Fórum Script Brasil
  • 0

JavaScript: 3 Select's valor diferente


Gui martins

Pergunta

Pessoal,

Estou criando um formulário no qual tenho 3 select's cada um em uma página diferente.

O que eu quero é que quando na primeira pagina ele selecionar um valor no select na 2 e na 3 pagina que contem outros selects ele não apareça e assim vale para a 2 página também.

Tentei usando este código abaixo mas não consegui:

Página 01

<p>Primer Más Importante:<br /><SELECT NAME="AS01i" onclick="java script:selecionarAreasImportantes(this);" >

<OPTION selected>Seleccionar...</option>

</SELECT>

</p>

Página 02

<p >Segundo Más Importante:<br /><SELECT NAME="AS02i" onclick="java script:selecionarAreasImportantes(this);" class="select" >

<OPTION selected>Seleccionar...</option>

</SELECT>

</p>

Página 03

<p >Tercer Más Importante:<br /><SELECT NAME="AS03i" onclick="java script:selecionarAreasImportantes(this);">

<OPTION selected>Seleccionar...</option>

</SELECT>

</p>

<script LANGUAGE="JavaScript">
function selecionarAreasImportantes( select ) {
        var frm = document.forms["Survey"];

        for(var i = 0; i < 3; i++){
            var element = frm.elements["AS0" + (2 + i) + "i"];

            /*
             * Se o "select" clicado for diferente do que 
             * está sendo percorrido...
             */
            if(element != select){
                
                /*
                 * ... e se o valor do select for "", então
                 * adicione o valor anterior do "select" no que está sendo
                 * percorrido. Para isto, verifica-se qual opção está presente no
                 * "select" e que não se encontra nos demais.
                 */
                if(select.value == ""){
                    
                    /*
                     * Percorre-se os elementos do "select"... 
                     */
                    for(var j = 1; j < select.options.length; j++){
                        var k;

                        /*
                         * ... e os elementos do outro "select".
                         */
                        for(k = 1; k < element.options.length; k++){
                            
                            /*
                             * Caso o elemento exista nos dois objetos,
                             * parte-se para outro...
                             */
                            if(select.options[j].value == element.options[k].value){
                                break;
                            }
                        }
                        
                        /*
                         * ... mas se o objeto não foi encontrado, então adiciona-se.
                         */
                        if(k == element.options.length){
                            element.options[element.options.length] = new Option(select.options[j].text, select.options[j].value);
                            break;
                        }
                    }    
                }
                
                /*
                 * Já se o valor do select não for "", então
                 * deve-se retirar a opção dos demais "select"s.
                 */
                else{
                    for(var j = 1; j < element.options.length; j++){
                        if(element.options[j].value == select.value){
                            element.options[j] = null;
                        }
                    }
                }
            }
        }    
    }
</script>

Se alguém poder me ajudar eu agradeço

Valeu. Guilherme Martins

Link para o comentário
Compartilhar em outros sites

5 respostass a esta questão

Posts Recomendados

  • 0

Então Gui, esquece esse código aí rsrsrs.

Seguinte, olha só o que eu fiz agora:

window.onload=function(){
 form=document.getElementById("formulario")
 var select=form.getElementsByTagName("select")[0]

          for(var y=0; y<select.options.length; y++){
              if(QueryString("escolhido")==null) break
              if(
                  select.options[y].innerHTML==
                  QueryString("escolhido")
              ) select.removeChild(select.options[y])
          }
         select.onchange=function(){
             send(this.options[this.selectedIndex].innerHTML)
         }
}

Aqui eu fiz uma forma passando as variáveis escolhidas por query string. O código faz o seguinte:

1 - Pega o elemento select, se não houver querystring:

Ele adiciona um evento para o select, evento que ao mudar o valor é mandado o valor escolhido para a função send, que será uma função que vai abrir a nova página, mandando a query string.

Caso houver query string:

Ele verifica no select qual option tem o mesmo valor que a query string e remove o option do select.

Contudo, todavia, porém, entretanto, você deve ter a função QueryString, que é essa

Então você colocaria essas duas funções em todas as 3 paginas. Você teria que mudar apenas a função send, que seria uma função que abriria a nova página e alterar o form pego pelo document.getElementById() no inicio do window.onload, que pode mudar de página para outra.

Sacou?

Aquele abraço.

Link para o comentário
Compartilhar em outros sites

  • 0

Valeu pela ajuda

Salve Kaka,,,,

Eu fiz tudo como voce falou puis os 2 codigos nas 3 paginas mas não funfou

window.onload=function(){
form=document.getElementById("formulario")
var select=form.getElementsByTagName("select")[0]

          for(var y=0; y<select.options.length; y++){
              if(QueryString("escolhido")==null) break
              if(
                  select.options[y].innerHTML==
                  QueryString("escolhido")
              ) select.removeChild(select.options[y])
          }
         select.onchange=function(){
             send(this.options[this.selectedIndex].innerHTML)
         }
}

window.onload=function(){
form=document.getElementById("formulario")
var select=form.getElementsByTagName("select")[0]

          for(var y=0; y<select.options.length; y++){
              if(QueryString("escolhido")==null) break
              if(
                  select.options[y].innerHTML==
                  QueryString("escolhido")
              ) select.removeChild(select.options[y])
          }
         select.onchange=function(){
             send(this.options[this.selectedIndex].innerHTML)
         }
}

Editado por fercosmig
Adicionar tag CODE
Link para o comentário
Compartilhar em outros sites

  • 0

Como nãoooooooo?!?!?!

Ó, eu fiz a parte prática:

pagina1.htm


<html>
<head>
<script type="text/javascript">

function send(string){
window.open("pagina2.htm?escolhido="+string, "", "")
}
function QueryString(variavel){
var variaveis=location.search.replace(/\x3F/,"").replace(/\x2B/g," ").split("&")
var nvar
if(variaveis!=""){
var qs=[]
for(var i=0;i<variaveis.length;i++){
nvar=variaveis[i].split("=")
qs[nvar[0]]=unescape(nvar[1])
}
return qs[variavel]
}
return null
}

window.onload=function(){
var select=document.getElementsByTagName("select")
for(var x=0; x<select.length; x++){
for(var y=0; y<select[x].options.length; y++){
if(QueryString("escolhido")==null) break
if(
select[x].options[y].innerHTML==
QueryString("escolhido")
) select[x].removeChild(select[x].options[y])
}
select[x].onchange=function(){
send(this.options[this.selectedIndex].innerHTML)
}
}
}
</script>



</head>
<body>

<select>
<option>Valor1</option>
<option>Valor2</option>
<option>Valor3</option>
</select>



</body>
</html>
[/codebox]

pagina2.htm

[codebox]
<html>
<head>
<script type="text/javascript">

function send(string){
window.open("pagina3.htm?escolhido="+string, "", "")
}
function QueryString(variavel){
var variaveis=location.search.replace(/\x3F/,"").replace(/\x2B/g," ").split("&")
var nvar
if(variaveis!=""){
var qs=[]
for(var i=0;i<variaveis.length;i++){
nvar=variaveis[i].split("=")
qs[nvar[0]]=unescape(nvar[1])
}
return qs[variavel]
}
return null
}

window.onload=function(){
var select=document.getElementsByTagName("select")
for(var x=0; x<select.length; x++){
for(var y=0; y<select[x].options.length; y++){
if(QueryString("escolhido")==null) break
if(
select[x].options[y].innerHTML==
QueryString("escolhido")
) select[x].removeChild(select[x].options[y])
}
select[x].onchange=function(){
send(this.options[this.selectedIndex].innerHTML)
}
}
}
</script>



</head>
<body>

<select>
<option>Valor1</option>
<option>Valor2</option>
<option>Valor3</option>
</select>



</body>
</html>

pagina3.htm


<html>
<head>
<script type="text/javascript">

function send(string){
window.open("pagina1.htm?escolhido="+string, "", "")
}
function QueryString(variavel){
var variaveis=location.search.replace(/\x3F/,"").replace(/\x2B/g," ").split("&")
var nvar
if(variaveis!=""){
var qs=[]
for(var i=0;i<variaveis.length;i++){
nvar=variaveis[i].split("=")
qs[nvar[0]]=unescape(nvar[1])
}
return qs[variavel]
}
return null
}

window.onload=function(){
var select=document.getElementsByTagName("select")
for(var x=0; x<select.length; x++){
for(var y=0; y<select[x].options.length; y++){
if(QueryString("escolhido")==null) break
if(
select[x].options[y].innerHTML==
QueryString("escolhido")
) select[x].removeChild(select[x].options[y])
}
select[x].onchange=function(){
send(this.options[this.selectedIndex].innerHTML)
}
}
}
</script>



</head>
<body>

<select>
<option>Valor1</option>
<option>Valor2</option>
<option>Valor3</option>
</select>



</body>
</html>
[/codebox]

Nesse exemplo, a página 1 chama a 2, a 2 chama a 3, e a 3 chama a 1. Lógico que você não vai ficar copiando os códigos em js toda hora, basta fazer um "include", e só na chamada da função você passa os parametros que mudarão de página pra outra.

Link para o comentário
Compartilhar em outros sites

  • 0

Não...alguma coisa está fazendo errado.

O código que eu te mostrei é genérico nesse aspecto, funcionará pra 0 a infintos options.

Infinitos em teoria, não vai experimentar rsrsrsrs.

Aquele abraço.

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,1k
    • Posts
      651,8k
×
×
  • Criar Novo...