Ir para conteúdo

POWERED BY:

Arquivado

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

dioness

[Resolvido] Copiar valor de um select

Recommended Posts

Olá

Estou tentando fazer um programa em php, que quando clicar um botao, este botao chame uma função javascript, que crie um select, e este select tenha os mesmos valores de um outro select já existente. Estou postando um exemplo parecido, para nao ter que colocar meu código inteiro. Mas no meu programa, o select já existente puxa dados do banco, por isso preciso copiar os valores dele.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function add(){
	var nova_linha = document.createElement('tr');
	
	
	var selec = document.createElement('select');
	selec.setAttribute('id','novo');
	selec.setAttribute('name','novo');
	
	
	var option = document.createElement('option'); //aux
	var option_antigo = document.getElementById("teste");
	var valor;
	var a;
	
    for (a = 0; a < document.getElementById("teste").options.length; a++){
	alert("asd"); 	//option.setAttribute("value",document.getElementById("fn_professor_1").options[a].value);
	 	//option.setAttribute("text",document.getElementById("fn_professor_1").options[a].text);
	 
	 	valor = option_antigo.options[a].text;
	 	//alert(option_antigo.options[a].text);
	 
     	option.innerHTML = (''+valor) ;
	 	selec.appendChild(option);		
	}
	
	var coluna_selec = document.createElement('td');
	coluna_selec.appendChild(selec);
	
	nova_linha.appendChild(coluna_selec);
	
	var tbody = document.createElement("TBODY");
	tbody.appendChild(nova_linha);
	
	var tabela = document.getElementById("tabela");
	tabela.appendChild(tbody);

	
}
</script>
</head>

<body>
<table id="tabela">
	<tr>
		<td>
			<select name="teste" id="teste">
  				<option value="1">Primeiro</option>
  				<option value="2">Segundo</option>
  				<option value="3">Terceiro</option>
			</select>
		</td>
        <td>
        	<input name="botao" type="button" value="Add" OnClick = "add()"/>
        </td>
	</tr>
</body>
</html>

Desde já agradeço

Compartilhar este post


Link para o post
Compartilhar em outros sites

Consegui Resolver o problema. Na verdade eu estava criando apenas um option e colocando todas as opções nele... ai aparecia só a última. colocando a criação do option dentro do for resolve tudo

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function add(){
	var nova_linha = document.createElement('tr');
	
	
	var selec = document.createElement('select');
	selec.setAttribute('id','novo');
	selec.setAttribute('name','novo');
	
	
	var option = document.createElement('option'); //aux
	var option_antigo = document.getElementById("teste");
	var a;
	
    for (a = 0; a < document.getElementById("teste").options.length; a++){
	 	option = document.createElement('option');
     	option.innerHTML = option_antigo.options[a].text;
	 	option.value = option_antigo.options[a].value;
	 	selec.appendChild(option);		
	}
	
	var coluna_selec = document.createElement('td');
	coluna_selec.appendChild(selec);
	
	nova_linha.appendChild(coluna_selec);
	
	var tbody = document.createElement("TBODY");
	tbody.appendChild(nova_linha);
	
	var tabela = document.getElementById("tabela");
	tabela.appendChild(tbody);

	
}
</script>
</head>

<body>
<table id="tabela">
	<tr>
		<td>
			<select name="teste" id="teste">
  				<option value="1">Primeiro</option>
  				<option value="2">Segundo</option>
  				<option value="3">Terceiro</option>
			</select>
		</td>
        <td>
        	<input name="botao" type="button" value="Add" OnClick = "add()"/>
        </td>
	</tr>
</body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

ohhhh amigo, agora que eu criei um para voce ja ta resolvido :D :D

mas nao tem problema vou deixar aqui para buscas futuras

 

<html>
<head>
<title>Untitled</title>
<script type="text/javascript">
	function selectClone(id){
		//o select 'fonte', que vai ser copiado;
		var slSource = document.getElementById(id);
		//guarda o valor do option do 'fonte'
		var slSourceOp;

		//cria um novo select
		var slClone = document.createElement("select");
		//variavel onde vai criar os options clonados
		var slCloneOp;
		//variavel com o texto e o valr do select
		var slCloneT,slCloneV;

		for(i=0;i<slSource.options.length;i++){
			slSurceOp = slSource.options;
			slCloneT = slSurceOp[i].text;
			slCloneV = slSurceOp[i].value;

			slCloneOp = new Option(slCloneT,slCloneV);
			slClone.options[i] = slCloneOp;
		}

		//adiciona o slect clonado no body do html
		document.body.appendChild(slClone);
	}
</script>
</head>
<body>
<select id="meuSelect" onchange="selectClone(this.id)">
	<option>Fonte</option>
	<option>Valor 1</option>
	<option>Valor 2</option>
	<option>Valor 3</option>
	<option>Valor 4</option>
	<option>Valor 5</option>
</select>

</body>
</html>

 

 

flws

Compartilhar este post


Link para o post
Compartilhar em outros sites

Ta certo ;D

Muito obrigado pela ajuda... o teu tá mais comentado, mais certinho...

fica pra futuras buscas mesmo. Pois quando precisei pesquisei bastante, e nao achei nada sobre isso. Agora fica ai pra quem precisar

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.