Ir para conteúdo

Arquivado

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

marcelobbt

Adicionar campos (inputs) no form

Recommended Posts

Eu achei esse código que adiciona campos, porém ele adiciona sempre campos com names iguais. Precisava que ele adicionasse um ao índice em cada name para que pudesse ler os valores de cada campo.

 

Tentei inserir o índice $i, mas ao criar o campo o código insere "$i" em vez do valor, ficando assim:

<fieldset id="inputs_adicionaisF">

... <input type="text" name="risco[$i]"> ...

... <input type="text" name="risco[$i]"> ...

</fieldset>

 

enquanto que o que eu preciso é algo assim:

 

<fieldset id="inputs_adicionaisF">

... <input type="text" name="risco[1]"> ...

... <input type="text" name="risco[2]"> ...

</fieldset>

 

Abaixo o código (Obs: inseri o script apenas do primeiro campo, os outros são repetição com nomes alterados):

<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$i = 0;
		var input = '<label>Risco Físico: <input type="text" name="riscoF[$i]" /> <a href="#">X</a></label><br>';
		$("input[name='addRF']").click(function( e ){
			$('#inputs_adicionaisF').append( input );
		});
		$('#inputs_adicionaisF').delegate('a','click',function( e ){
			e.preventDefault();
			$( this ).parent('label').remove();
		});$i++;
	});
</script>


<fieldset>
	<p><form action="http://localhost/PPRA/GHE/editarriscos/1" method="post" accept-charset="utf-8">
</p>
	<label>Nome do GHE:</label>
	<p><select name="nomegheform" id="nomegheform">
<option value="0">Operação</option>
</select>
</p>
	<label><input type="button" name="addRF" value="Adicionar Risco Físico" /></label>
	<fieldset id="inputs_adicionaisF"></fieldset>
	<label><input type="button" name="addRQ" value="Adicionar Risco Químico" /></label>
	<fieldset id="inputs_adicionaisQ"></fieldset>
	<label><input type="button" name="addRB" value="Adicionar Risco Biológico" /></label>
	<fieldset id="inputs_adicionaisB"></fieldset>
	<label> </label>
	<p><input type="submit" name="salvar" value="Salvar"  />
</p>
</fieldset>

Compartilhar este post


Link para o post
Compartilhar em outros sites
<script type="text/javascript">
	$(document).ready(function(){
		var i = 0;
		var input = '<label>Risco Físico: <input type="text" name="riscoF['+i+']" /> <a href="#">X</a></label><br>';
		$("input[name='addRF']").click(function( e ){
			$('#inputs_adicionaisF').append( input );
		});
		$('#inputs_adicionaisF').delegate('a','click',function( e ){
			e.preventDefault();
			$( this ).parent('label').remove();
		});
             i++;
	});
</script>

Acho que isso resolve

Compartilhar este post


Link para o post
Compartilhar em outros sites

Ah sim,

<script type="text/javascript">
$(document).ready(function(){
var i = 0;
var input = '<label>Risco Físico: <input type="text" name="riscoF['+i+]" /> <a href="#">X</a></label><br>';
$("input[name=addRF]").click(function( e ){
$('#inputs_adicionaisF').append( input );

i++;
});
$('#inputs_adicionaisF').delegate('a','click',function( e ){
e.preventDefault();
$( this ).parent('label').remove();

i--;
});
});
</script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Funcionou!

Tive que colocar o input para dentro da função veja abaixo.

<script type="text/javascript">
    $(document).ready(function(){
        var i = 0;
        
        $("input[name='addRF']").click(function( e ){
            var input = '<label>Risco Físico: <input type="text" name="riscoF['+i+']" /> <a href="#">X</a></label><br>';
            $('#inputs_adicionaisF').append( input );
            i++;
        });
        $('#inputs_adicionaisF').delegate('a','click',function( e ){
            e.preventDefault();
            $( this ).parent('label').remove();
            i--;
        });
    });
</script>

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.