Criar inputs ao selecionar valor

[Bruno Medeiros]

Pessoal,

Tenho um select com uma quantidade de valores. Gostaria que quando selecionasse um valor (3, por exemplo), fosse criado 3 campos input.

Alguém já fez algo parecido?

Att,

--

Bruno Medeiros
brun.m...@gmail.com

            

[Eduardo Severo Moraes]

Ola, sim , no onChange do select, tu pega o valor do select, faz um for e gera os inputs eja vai inserindo eles no local do html que tu escolher.

--
--
Grupo de jQuery Brasil.
 
REGRAS: https://docs.google.com/document/d/1VfvTDmeHTSj-L5ouZJjQQ4OkjTCU1Hr2XtPYBNGVHH4/edit
 
USE O JSBIN.COM / JSFIDDLE.NET PARA CÓDIGOS.
 
Email: jque...@googlegroups.com
Biba: jquery-br+...@googlegroups.com
Site: http://groups.google.com/group/jquery-br?hl=pt-BR

---
Você recebeu essa mensagem porque está inscrito no grupo "jQuery (Brasil)" dos Grupos do Google.
Para cancelar inscrição nesse grupo e parar de receber e-mails dele, envie um e-mail para jquery-br+...@googlegroups.com.
Para mais opções, acesse https://groups.google.com/d/optout.

--

Eduardo Severo Moraes

World Wild Web Developer

skype #eduardo...@gmail.com

telefone: #51-81253593

[Luiz Paulo Valença]

E ae cara, beleza! Segue um exemplo simples: http://jsfiddle.net/luizpaulo165/u5mab6kt/7/

HTML

<select name="" id="">
    <option value="">Selecione algo</option>
    <option value="1">Criar inputs</option>
    <option value="2">Remove inputs</option>
</select>

<div class="wrap-inputs"></div>

jQuery

$(function() {
    $('select').change(function() {
        $(this).find('option:selected').each(function(elem) {
            if ($(this).val() == '1') {
                createInputs();
            } else if ($(this).val() == '2') {
                $('.wrap-inputs input, .wrap-inputs label').remove();
            }
        });
    });
   
    // funcao que cria os inputs
    var createInputs = function () {
        var input1 = $('<label>Input 1</label><input />',{
            'id': 'input-1'
        }).appendTo($('.wrap-inputs'));
       
        var input2 = $('<label>Input 2</label><input />',{
            'id': 'input-1'
        }).appendTo($('.wrap-inputs'));
       
        var input3 = $('<label>Input 3</label><input />',{
            'id': 'input-1'
        }).appendTo($('.wrap-inputs'));
    }
});

CSS

select{
    font-size:16px;
    color:#ffffff;
    background:#FC6042;
    width:99%;
    display:block;
    border:0;
    margin-bottom:40px;
    padding:20px;
}
label{
    color:#2C82C9;
    display:block;
}
input{
    font-size:16px;
    color:#ffffff;
    background:#2CC990;
    width:90%;
    border:0;
    margin-bottom:20px;
    padding:20px;
}

Qualquer bronca é só chamar! =D

[Eduardo Severo Moraes]

Boa solução, eu ainda adicionaria um parâmetro na assinatura do createInputs(), que seria nro de inputs a serem criados 

--

--
Grupo de jQuery Brasil.
 
REGRAS: https://docs.google.com/document/d/1VfvTDmeHTSj-L5ouZJjQQ4OkjTCU1Hr2XtPYBNGVHH4/edit
 
USE O JSBIN.COM / JSFIDDLE.NET PARA CÓDIGOS.
 
Email: jque...@googlegroups.com
Biba: jquery-br+...@googlegroups.com
Site: http://groups.google.com/group/jquery-br?hl=pt-BR

---
Você recebeu essa mensagem porque está inscrito no grupo "jQuery (Brasil)" dos Grupos do Google.
Para cancelar inscrição nesse grupo e parar de receber e-mails dele, envie um e-mail para jquery-br+...@googlegroups.com.
Para mais opções, acesse https://groups.google.com/d/optout.