Foreach na view montando DIVs
Tenho uma DIV que tem alguns campos. Ao preencher esses campos, e após uma validação dos campos por javascript, deverá montar uma DIV se for apenas um passageiro. Caso seja mais de um, então terei que criar a quantidade de DIV''s com os seus campos de acordo com o valor de um Textbox. Se for 3 tres DIV''s e assim por diante. Como eu faço isso?
Pjava
Curtidas 0
Respostas
Pjava
13/03/2014
Complementando, isso será chamado no Click de um botão.
GOSTEI 0
Pjava
13/03/2014
No click do botão que está em cima, toda essas div e demais controles deverão se repetir caso haja mais de passageiro.
<div class="grid_17"> <button value="novaPesquisa" class="btn-pular-passo pull-right">Continuar</button> </div> <div class="form-group"> <div class="grid_4"> <label>CEP</label> </div> <div class="grid_14"> <input type="number" name="txtCpf" class="grid_3 required" placeholder="00000-000" /> </div> </div> <div class="form-group"> <div class="grid_4"> <label>Endereço</label> </div> <div class="grid_14"> <input type="text" name="txtNome" class="grid_14 required" placeholder="Nome completo" /> </div> </div> <div class="form-group"> <div class="grid_4"> <label>Número</label> </div> <div class="grid_4"> <input type="text" name="txtEmail" class="grid_3 required" /> </div> <div class="grid_2"> <label>Complemento</label> </div> <div class="grid_8"> <input type="text" name="txtCpf" class="grid_8 required" /> </div> </div> <div class="form-group"> <div class="grid_4"> <label>Telefone</label> </div> <div class="grid_6"> <input type="text" name="txtEmail" class="grid_6 required" /> </div> <div class="grid_2"> <label>Celular</label> </div> <div class="grid_6"> <input type="text" name="txtCpf" class="grid_6 required" /> </div> </div>
GOSTEI 0
Pjava
13/03/2014
Fiz usando for assim, e me dois problemas.
1) Não consigo colocar o button fora do for para não se repetir, pois eu devo ter apenas um botão.
2) Tem um edit chamado de txtNome. Preciso compor o name dele assim: txtNome + posição de i. O que passa é que não consigo retirar o espaço, aí fica: txtNome 1 e deveria ficar txtNome1
3) Como eu faço para colocar zero à esquerda do número, tipo: Dados do Passageiro 01 e não Dados do Passageiro 1 como está atualmente. Abaixo meu for:
1) Não consigo colocar o button fora do for para não se repetir, pois eu devo ter apenas um botão.
2) Tem um edit chamado de txtNome. Preciso compor o name dele assim: txtNome + posição de i. O que passa é que não consigo retirar o espaço, aí fica: txtNome 1 e deveria ficar txtNome1
3) Como eu faço para colocar zero à esquerda do número, tipo: Dados do Passageiro 01 e não Dados do Passageiro 1 como está atualmente. Abaixo meu for:
for (int i = 1; i < 3; i++) { <div class="grid_19 box-resultado"> <div class="dados-pagamento"> <!-- INGRESSOS E SHOWS --> <div class="grid_19"> <h1>Dados do Passageiro @i</h1> </div> <!-- PRIMEIRO INGRESSO --> <div class="dados"> <form class=""> <div class="form-group"> <div class="grid_4"> <label>Nome do passageiro</label> </div> <div class="grid_14"> <input type="text" name="txtNome @i" class="grid_14 required" placeholder="Nome completo" /> </div> </div> <div class="form-group"> <div class="grid_4"> <label>Data Nascimento</label> </div> <div class="grid_7"> <select name="txtDia" class="grid_2"> <option>Dia</option> </select> <select name="txtDia" class="grid_2"> <option>Mês</option> </select> <select name="txtDia" class="grid_2"> <option>Ano</option> </select> </div> <div class="grid_2"> <label>Sexo</label> </div> <div class="grid_5"> <select name="txtDia" class="grid_3"> <option>Sexo</option> <option>Masculino</option> <option>Feminino</option> </select> </div> </div> <div class="form-group"> <div class="grid_4"> <label>Número do passaporte</label> </div> <div class="grid_5"> <input type="number" name="txtCpf" class="grid_4 required" /> </div> <div class="grid_2"> <label>Validade</label> </div> <div class="grid_6"> <select name="txtDia" class="grid_2"> <option>Dia</option> </select> <select name="txtDia" class="grid_2"> <option>Mês</option> </select> <select name="txtDia" class="grid_2"> <option>Ano</option> </select> </div> </div> <div class="form-group"> <div class="grid_4"> <label>País de emissão</label> </div> <div class="grid_5"> <select name="txtDia" class="grid_3"> <option>País</option> </select> </div> </div> <div class="grid_17"> <button value="novaPesquisa" class="btn-pular-passo pull-right">Ir para o pagamento</button> </div> </form> </div> </div> </div> } }
GOSTEI 0
Pjava
13/03/2014
O botão resolvi retirando ele do loop e criando uma nova div só pra ele. Falta agora os outros dois.
GOSTEI 0
Pjava
13/03/2014
A questão do nome do attrib Name eu resolvi assim. Declarei variáveis, concatenei com a variável i e depois compus o attrib Name assim:
Só falta agora a questão do zero à esquerda
nm,dia,mes,ano,sexo,numpassaporte, diavalidade, mesvalidade, anovalidade, paisemissao = ""; for (int i = 1; i < 3; i++) { nm = "txtNome" + i; dia = "txtDia" + i; mes = "txtMes" + i; ano = "txtAno" + i; sexo = "txtSexo" + i; numpassaporte = "txtPassaporte" + i; diavalidade = "txtDiaVal" + i; mesvalidade = "txtMesVal" + i; anovalidade = "txtAnoVal" + i; paisemissao = "txtPaisEmissao" + i; ......... <input type="text" name=@nm class="grid_14 required" placeholder="Nome completo" /> .....
Só falta agora a questão do zero à esquerda
GOSTEI 0