[Resolvido] criar campos de acordo com opcao do combo

[ronaldosdb 1]

Ola turma, procurei alguns exemplos do forum, mas sinceramente nao soube adaptar:

 

Gostaria de saber de forma simples como criar campos dinamicamente

 

Vou ter um fom com um combo: Qtos participantes você deseja escrever?

 

1 participante

 

2 participante

 

3 participante

 

Se a pessoa escolher 1 no combo aparecera 1 campo texto embaixo desse combo

Se a pessoa escolher 2 no combo aparecera 2 campo textos embaixo desse combo

 

e assim por diante

 

Agora, se ela escolheu 5 e muda pra 2 o numero de campos texto deve se ajustar automaticamente...

 

Tem como?

 

Vleu

 

Ronaldo

[andreia_sp 1]

A lógica até que é simples:

 

- no value do teu combo coloque a qtde informada exemplo: opção "1 participante" o value é 1 "2 participantes" value é 2, ....

- no evento onchange do combo voce chama uma função

- esta função recebe o value do select (que é o value do item selecionado)

- com esse numero você faz um FOR para criar X elementos (use o createElement)

- para remover você pode ou usar o removeChild ou entao, se você usar uma DIV container (que receberá os itens criados) o innerHTML será substituido.

 

Se você tiver em maos algum exemplo do createElement vai ser bem simples seguindo os passos. Se ainda sobrar duvidas, vai postando o que você tiver em maos que vamos te ajudando ;]

[ronaldosdb 1]

Andreia, valeu pela dica. Pesquisei um pouco sobre o tema....

 

Por enquanto tenho somente o combo

 

<select name="ncampos" id="ncampos">
					<option>Quantas inscrições está fazendo?</option>
					<option>1</option>
					<option>2</option>
					<option>3</option>
					<option>4</option>
					<option>5</option>
					<option>6</option>
					<option>7</option>
					<option>8</option>
					<option>9</option>
					<option>10</option>
				  </select>

Dai consegui criar campos clicando no link com essa funcao, mas eu queria mesmo é que quando o usuario escolher o numero no combo os campos texto fossem criado automaticamente. Exemplo: se ele escolher 1 cria um campo, se escolher 2 cria dois campos e assim por diante.

 

<script>

var linha
linha = 1

function replica(){

var campos = new Array(3)
campos[0] = "datadefabricacao";
campos[1] = "datadevalidade";
campos[2] = "lote";

document.getElementsByTagName("form")[0].innerHTML += "<div>" + document.getElementsByTagName("div")[0].innerHTML + "</div>";

div_nova = document.getElementsByTagName("div")[linha]
inputs_novos = div_nova.getElementsByTagName("input");

	for(i=0;i<inputs_novos.length;i++)
	{
	inputs_novos[i].id = campos[i]+"#"+linha;
	}

	linha++;

}

// essa função é só para tu clicar em qualquer input e ver que o id foi alterado
function mudou_id(obj){
alert(obj.id);
}

</script>

[ronaldosdb 1]

Alguém tem uma luz!!!

 

Precismo mto entender isso

 

Valeu

 

Ronaldo

[ronaldosdb 1]

Andréia, será que da para adaptar?

 

<script> 

//exemplo de adicionar campos dinâmicos à um formulário 
//acrescido uma variavel que limita numero de campos 
//e exemplo em php de como recuperar os valores do form 
//www.gambiarra.com.br  
//Function Leonardo_Giori(BOZO); 

var iditem = 0; 
var limite = 5; 
function add(){ 
if(iditem<limite){ 
iditem++; 
var texto=document.getElementById('div').innerHTML; 
document.getElementById('div').innerHTML = texto + "<input type='text' name='item"+iditem+"' id='item"+iditem+"'><br>"; 
document.Form.itens.value = document.Form.itens.value = iditem;  
}else{ 
alert("Limite de "+limite+" campos!"); 
} 
} 
</script>

Se alguem souber da um toque, preciso mto mesmo

 

Valeu

[andreia_sp 1]

um exemplo simples:

 

<script>
function CriaCampos(qtde)
{
var campos="";

	for (var i=0; i < qtde; i++)
	{
		campos += "<input type'text' name='txt"+ i + "'><br>";		
	}
	document.getElementById("container").innerHTML = campos;
}
</script>

<select name="ncampos" id="ncampos" onchange="CriaCampos(this.selectedIndex)">
  <option>Quantas inscrições estão fazendo?</option>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
  <option>6</option>
  <option>7</option>
  <option>8</option>
  <option>9</option>
  <option>10</option>
</select>

<div id="container"></div>

[ronaldosdb 1]

Nossa Andréia, era exatamente isso!!!

 

Que fique de lição para quem mais precisar.

Já tinha tentado varias formas, mas sempre dava erro.

Muito obrigado mesmo.

 

 

Bom, deixa eu ver se entendi

 

 

<script>

 

AQUI VAI A FUNCAO POSSUI UM FOR QUE REPETE OS CAMPOS ATÉ A QUANTIDADE DESEJADA, PASSADA PELO PARAMETRO QTDE

function CriaCampos(qtde)
{
var campos="";

	for (var i=0; i < qtde; i++)
	{
		campos += "<input type'text' name='txt"+ i + "'><br>";		
	}

AQUI DECLARA-SE A DIV ONDE ELA DEVE CRIAR ESSES CAMPOS

document.getElementById("container").innerHTML = campos;
}
</script>

 

E POR FIM, O SELECT QUE CHAMA A FUNCAO QUE CRIA OS CAMPOS

 

<select name="ncampos" id="ncampos" onchange="CriaCampos(this.selectedIndex)">
  <option>Quantas inscrições estão fazendo?</option>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
  <option>6</option>
  <option>7</option>
  <option>8</option>
  <option>9</option>
  <option>10</option>
</select>

E A DIV QUE VAI RECEBER OS CAMPOS

 

<div id="container"></div>