Ir para conteúdo

POWERED BY:

Arquivado

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

fabiom2211

[Resolvido] Listbox

Por , em Javascript

Recommended Posts

fabiom2211    0

fabiom2211
Postado

Pessoal eu tenho um listbox...e quero enviar as opções que foram selecionados para outra tela

 


<script language="JavaScript">
function move(MenuOrigem, MenuDestino){
   var arrMenuOrigem = new Array();
   var arrMenuDestino = new Array();
   var arrLookup = new Array();
   var i;
   for (i = 0; i < MenuDestino.options.length; i++){
       arrLookup[MenuDestino.options[i].text] = MenuDestino.options[i].value;
       arrMenuDestino[i] = MenuDestino.options[i].text;
   }
   var fLength = 0;
   var tLength = arrMenuDestino.length;
   for(i = 0; i < MenuOrigem.options.length; i++){
       arrLookup[MenuOrigem.options[i].text] = MenuOrigem.options[i].value;
       if (MenuOrigem.options[i].selected && MenuOrigem.options[i].value != ""){
           arrMenuDestino[tLength] = MenuOrigem.options[i].text;
           tLength++;
       }
       else{
           arrMenuOrigem[fLength] = MenuOrigem.options[i].text;
           fLength++;
       }
   }

   MenuOrigem.length = 0;
   MenuDestino.length = 0;
   var c;
   for(c = 0; c < arrMenuOrigem.length; c++){
       var no = new Option();
       no.value = arrLookup[arrMenuOrigem[c]];
       no.text = arrMenuOrigem[c];
       MenuOrigem[c] = no;
   }
   for(c = 0; c < arrMenuDestino.length; c++){
       var no = new Option();
       no.value = arrLookup[arrMenuDestino[c]];
       no.text = arrMenuDestino[c];
       MenuDestino[c] = no;
  }
}
</script>

<html>
<head>
<title>Movendo itens de um select para o outro</title>
</head>
<body>
<form name="combo_box">
   <table>
       <tr>
           <td>
               <select multiple size="10" name="list1" style="width:150">
               <option value="1">Acre</option>
               <option value="2">Alagoas</option>
               <option value="3">Amapá</option>
               <option value="4">Amazonas</option>
               <option value="5">Bahia</option>
               <option value="6">Ceará</option>
               <option value="7">Distrito Federal</option>
               <option value="8">Espírito Santo</option>
               <option value="9">Goiás</option>
               <option value="10">Maranhão</option>
               <option value="11">Mato Grosso</option>
               <option value="12">Mato Grosso do Sul</option>
               <option value="13">Minas Gerais</option>
               <option value="14">Pará</option>
               <option value="15">Paraíba</option>
               <option value="16">Paraná</option>
               <option value="17">Pernambuco</option>
               <option value="18">Piauí</option>
               <option value="19">Rio de Janeiro</option>
               <option value="20">Rio Grande do Norte</option>
               <option value="21">Rio Grande do Sul</option>
               <option value="22">Rondônia</option>
               <option value="23">Roraima</option>
               <option value="24">Santa Catarina</option>
               <option value="25">São Paulo</option>
               <option value="26">Sergipe</option>
               <option value="27">Tocantins</option>
               </select>
           </td>
           <td align="center" valign="middle">
               <input type="button" onClick="move(this.form.list2,this.form.list1)" value="<<">
               <input type="button" onClick="move(this.form.list1,this.form.list2)" value=">>">
           </td>
           <td>
               <select multiple size="10" name="list2" style="width:150">
               </select>
           </td>
       </tr>
   </table>
</form>
</body>
</html>

 

como faço para enviar para a proxima tela apenas as opções que foram selecionados...

 

Att, Fabio

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Use o input type="submit", você vai receber um array.

Não precisa de nenhum Javascript nisso.. é apenas a mecânica HTML do <select> multiple.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

veja:

 

<?php 
	var_dump( $_POST );
	
	print_r( $_POST['estados'] );
?>             

	<form action="" method="post">
		<select multiple="multiple" size="10" name="estados[]" style="width:150">
			<option value="1">Acre</option>
			<option value="2">Alagoas</option>
			<option value="3">Amapá</option>
			<option value="4">Amazonas</option>
			<option value="5">Bahia</option>
			<option value="6">Ceará</option>
			<option value="7">Distrito Federal</option>
			<option value="8">Espírito Santo</option>
			<option value="9">Goiás</option>
			<option value="10">Maranhão</option>
			<option value="11">Mato Grosso</option>
			<option value="12">Mato Grosso do Sul</option>
			<option value="13">Minas Gerais</option>
			<option value="14">Pará</option>
			<option value="15">Paraíba</option>
			<option value="16">Paraná</option>
			<option value="17">Pernambuco</option>
			<option value="18">Piauí</option>
			<option value="19">Rio de Janeiro</option>
			<option value="20">Rio Grande do Norte</option>
			<option value="21">Rio Grande do Sul</option>
			<option value="22">Rondônia</option>
			<option value="23">Roraima</option>
			<option value="24">Santa Catarina</option>
			<option value="25">São Paulo</option>
			<option value="26">Sergipe</option>
			<option value="27">Tocantins</option>
		</select>
		<input type="submit" name="enviar" value="enviar" />
	</form>

http://www.criarweb.com/artigos/180.php

Compartilhar este post

Link para o post
Compartilhar em outros sites

fabiom2211    0

fabiom2211
Postado

beleza...só tem uma coisa

isso trabalhando com um listbox ta beleza...

o meu problema é trablhando com duas listbox...

exemplo:

no 1°listbox fica todas as opções...

na 2°listbox fica as opções que foram enviados para o segundo listbox...

=========================================================================================

só que quando eu coloco no início do segundo listbox o javascript para de funcionar

não consigo mandar as opções do 1°listbox para o segundo listbox...

e tambem não consigo mandar para a outra página as opções que estão no segundo listbox

=========================================================================================

 

 



<script language="Javascript">
function move(MenuOrigem, MenuDestino){
   var arrMenuOrigem = new Array();
   var arrMenuDestino = new Array();
   var arrLookup = new Array();
   var i;
   for (i = 0; i < MenuDestino.options.length; i++){
       arrLookup[MenuDestino.options[i].text] = MenuDestino.options[i].value;
       arrMenuDestino[i] = MenuDestino.options[i].text;
   }
   var fLength = 0;
   var tLength = arrMenuDestino.length;
   for(i = 0; i < MenuOrigem.options.length; i++){
       arrLookup[MenuOrigem.options[i].text] = MenuOrigem.options[i].value;
       if (MenuOrigem.options[i].selected && MenuOrigem.options[i].value != ""){
           arrMenuDestino[tLength] = MenuOrigem.options[i].text;
           tLength++;
       }
       else{
           arrMenuOrigem[fLength] = MenuOrigem.options[i].text;
           fLength++;
       }
   }

   MenuOrigem.length = 0;
   MenuDestino.length = 0;
   var c;
   for(c = 0; c < arrMenuOrigem.length; c++){
       var no = new Option();
       no.value = arrLookup[arrMenuOrigem[c]];
       no.text = arrMenuOrigem[c];
       MenuOrigem[c] = no;
   }
   for(c = 0; c < arrMenuDestino.length; c++){
       var no = new Option();
       no.value = arrLookup[arrMenuDestino[c]];
       no.text = arrMenuDestino[c];
       MenuDestino[c] = no;
  }
}
</script>

<html>
<head>
<title>Movendo itens de um select para o outro</title>
</head>
<body>
<form name="combo_box" action="pagina2.php" method="post">
   <table>
       <tr>
           <td>
               <select multiple size="10" name="list1" style="width:150">
               <option value="1">Acre</option>
               <option value="2">Alagoas</option>
               <option value="3">Amapá</option>
               <option value="4">Amazonas</option>
               <option value="5">Bahia</option>
               <option value="6">Ceará</option>
               <option value="7">Distrito Federal</option>
               <option value="8">Espírito Santo</option>
               <option value="9">Goiás</option>
               <option value="10">Maranhão</option>
               <option value="11">Mato Grosso</option>
               <option value="12">Mato Grosso do Sul</option>
               <option value="13">Minas Gerais</option>
               <option value="14">Pará</option>
               <option value="15">Paraíba</option>
               <option value="16">Paraná</option>
               <option value="17">Pernambuco</option>
               <option value="18">Piauí</option>
               <option value="19">Rio de Janeiro</option>
               <option value="20">Rio Grande do Norte</option>
               <option value="21">Rio Grande do Sul</option>
               <option value="22">Rondônia</option>
               <option value="23">Roraima</option>
               <option value="24">Santa Catarina</option>
               <option value="25">São Paulo</option>
               <option value="26">Sergipe</option>
               <option value="27">Tocantins</option>
               </select>
           </td>
           <td align="center" valign="middle">
               <input type="button" onclick="move(this.form.list2,this.form.list1)" value="<<">
               <input type="button" onclick="move(this.form.list1,this.form.list2)" value=">>">
           </td>
           <td>
               <select multiple size="10" name="list2[]" style="width:150">
               </select>
           </td>
       </tr>
   </table>
                   <input type="submit" value="enviar">
</form>
</body>
</html>

 

 

pagina2.php

<?php
//exibe todos os itens selecionados
foreach ($_POST['list2'] as $valor)
    echo "<br> {$valor}";
?>

 

 

Att, Fabio

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Atribua: selected="selected" à todos os itens que você mandar para a segunda list.

Ai sim você conseguirá capturá-las.

 

Qnto a fazer o transporte de um item para o outro listbox, sugiro refazer esse código completamente, ou pegar um melhor.

Compartilhar este post

Link para o post
Compartilhar em outros sites

fabiom2211    0

fabiom2211
Postado

continua o mesmo problema...

============================

Em relação ao código para passar para o outro listbox...

eu peguei esse código na internet...

não entendo muito de javascript...

caso você tenha ou acha algum código melhor

do que esse...pode postar aqui...

 

Att, Fabio

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Um exemplo bem simples que acabei de fazer:

<?php 
	if( $_SERVER['REQUEST_METHOD']=='POST' )
	{
		var_dump( $_POST['list2'] );
	
	}
?>
<html>
<head>
<script type="text/javascript">
function id( el ){
	return document.getElementById( el );
}
function add(){
	var options = id('list1').options;
	
	var op = new Array();
	for( var i=0; i<options.length;i++ ){
		if( options[i].selected ){
			var op = document.createElement('option');
			op.value = options[i].value;
			op.innerHTML = options[i].innerHTML;
			op.selected = 'selected';//a 'mágica' acontece aqui
			id('list2').appendChild( op );
		}
	}
}
window.onload = function(){
	id('add').onclick = function(){
		add();
	}
}
</script>
</head>
<body>
	<form action="" method="post">
		<select multiple="multiple" size="10" name="list1[]" id="list1" style="width:150">
			<option value="1">Acre</option>
			<option value="2">Alagoas</option>
			<option value="3">Amapá</option>
			<option value="4">Amazonas</option>
			<option value="5">Bahia</option>
			<option value="6">Ceará</option>
			<option value="7">Distrito Federal</option>
			<option value="8">Espírito Santo</option>
			<option value="9">Goiás</option>
			<option value="10">Maranhão</option>
			<option value="11">Mato Grosso</option>
			<option value="12">Mato Grosso do Sul</option>
			<option value="13">Minas Gerais</option>
			<option value="14">Pará</option>
			<option value="15">Paraíba</option>
			<option value="16">Paraná</option>
			<option value="17">Pernambuco</option>
			<option value="18">Piauí</option>
			<option value="19">Rio de Janeiro</option>
			<option value="20">Rio Grande do Norte</option>
			<option value="21">Rio Grande do Sul</option>
			<option value="22">Rondônia</option>
			<option value="23">Roraima</option>
			<option value="24">Santa Catarina</option>
			<option value="25">São Paulo</option>
			<option value="26">Sergipe</option>
			<option value="27">Tocantins</option>
		</select>
		
		<input type="button" name="add" id="add" value="->" />
		
		<select multiple="multiple" size="10" name="list2[]" id="list2" style="width:150">
		</select>
	
		<input type="submit" name="enviar" value="enviar" />
	</form>
</body>
</html>
dica: ninguém sabia javascript ou qualquer outra coisa, quando começou, por isso estudamos, lemos tutoriais e livros.

Apenas 'pedir' ou ir atrás de 'códigos prontos', não enriquecerá o teu conhecimento, não tanto, qnto se você mesmo tentasse desenvolver.

Compartilhar este post

Link para o post
Compartilhar em outros sites

fabiom2211    0

fabiom2211
Postado

valeu cara obrigadão...

em relação ao seu comentario abaixo...

eu to começando estudar informatica tenho 4 meses estudando...

e eu as vezes quero ver as coisas funcionando...

pode deixar que eu to olhando a teoria...

obrigadao..

 

att, Fabio

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito