Ir para conteúdo

POWERED BY:

Arquivado

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

Wagner Martins - SC

add select

Por , em Javascript

Recommended Posts

Wagner Martins - SC    0

Wagner Martins - SC
Postado

Gostaria de saber alguma referência para esse meu problema:

 

Tenho um select que mostra a quantidade de pessoas para escolher de 1 a 5.

Quando clicar no numero 1, quero q o javascript adicione um select para selecionar a idade.

Qando clicar no numero 2, quero q o javascript adicione dois selects para selecionar as idades, e assim por diante.

 

Tentei achar na internet alguma coisa relacionada mais naum tive sucesso.



Achei essa solução:

 

Enjoy

 

 

<!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" src="https://www.linestur.com.br/ofertas/jquery-1.6.1.min.js"></script>
<script>
var message = new Array(); 
message[1] = "<select id=years_1 name=yeras_1><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select>"; 


message[2] = "<select id=years_1 name=yeras_1><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select><select id=years_2 name=yeras_2><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select>"; 


message[3] = "<select id=years_1 name=yeras_1><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select><select id=years_2 name=yeras_2><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select><select id=years_3 name=yeras_3><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select>"; 


message[4] = "<select id=years_1 name=yeras_1><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select><select id=years_2 name=yeras_2><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select><select id=years_3 name=yeras_3><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select><select id=years_4 name=yeras_4><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select>"; 


message[5] = "<select id=years_1 name=yeras_1><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select><select id=years_2 name=yeras_2><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select><select id=years_3 name=yeras_3><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select><select id=years_4 name=yeras_4><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select><select id=years_5 name=yeras_5><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select>"; 


$(document).ready(function(){ 
    $("#item_select").change(function() 
    { 
        var message_index 


        message_index = $("#item_select").val(); 
        $("#message_display").empty(); 


        if (message_index > 0) 
            $("#message_display").append(message[message_index]); 
    }); 
}); 






</script>
</head>


<body>
<select id="item_select" name="item"> 
    <option>Select an Item</option> 
    <option value="1">Item 1</option> 
    <option value="2">Item 2</option> 
    <option value="3">Item 3</option> 
    <option value="4">Item 4</option> 
    <option value="5">Item 5</option> 
</select>
<div id="message_display"></div>
</body>
</html>

 

Compartilhar este post

Link para o post
Compartilhar em outros sites

romerito    11

romerito
Postado

i aew cara, seria mais ou menos isso?

 

Os scripts:

$(function(){
		$('#inp_pessoas').change( function(){
			createSelectIdade($(this).val());
		});
	});
	
	function createSelectIdade(qtd){
		$('#message_display').html('');
		while (parseInt(qtd)){
			var select = $('<select name="selectIdade' + qtd-- + '" />');
			var option = '';			
			for (var i = 0; i <= 100; i++){
				option += '<option value="' + i + '">' + i + '</option>';
			}
			select.append(option);
			$('#message_display').append('Idade: ').append(select).append('<br />');
		}
	}

 

e o html:

 Quantidade pessoas: <select id="inp_pessoas" name="pessoas"> <option value="0">Selecione...</option> <option value="1">Pessoas 1</option> <option value="2">Pessoas 2</option> <option value="3">Pessoas 3</option> <option value="4">Pessoas 4</option> <option value="5">Pessoas 5</option> </select><div id="message_display"></div>

 

espero que ajude abraço!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Wagner Martins - SC    0

Wagner Martins - SC
Postado

Boa Romerito

 

Seu código é perfeito e melhor q o meu...

 

Eu não estou conseguindo pegar o valor do campo da idade das pessoas, tentei já com o _Post['selectIdade'], mais não deu certo, teria outra forma?



Usei esse código e deu certo

 

 

// começo o jquery

 

$(function($){
      
    // no id #enviar assim que clicar vai executar um função
    $('#enviar').click(function(){
     
    /* veja que eu criei variaveis para guardar os item
     * e sómente precisei usar a função val() para
     * retornar o valor dos campo para a varivel
     */
     
        var nome = $('#nome').val();
        var idade = $('#idade').val();
     
    // só parar testar coloco as variveis em um alert só para testar mesmo
    alert(nome + " " + idade);
     
    });
     
});

 

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