Inputs interativas

[Programar]

Eu preciso de inserir na base-de-dados todos os dados das inputs que inseri.

Eu tenho um quadro com as inputs (descricao,qtd,preco) e um botão de inserir

Ao carregar no botão insere-me a baixo mais um quadro igual ao anterior com as inputs (descricao,qtd,preco) e um botão de remover

Sempre que clico no botão inserir ele insere novos quadros sempre com a possibilidade de remover.

A linguagem que estou a fazer isto é php e javascript.

Este é o meu script:

<script type="text/javascript">

$(function(){

//Cria uma função para Criar os campos Nome e Telefone

function createDivFields(){

/*

Criamos a variavel, e atribuimos os campos que serão criados;

Utilizamos o colchetes nos nomes do campos para informar que os dados

em forma de array;

Adiciona uma div, para que nela seja criado novos campos extras;

E um link para para chamar o evento de adicionar;

*/

var html = '<tr>';

html += '<td></td><td><textarea name="descricao_assistencia[]" class="textarea"></textarea>';

html += 'Qtd: <input type="text" name="qtd[]" value="1" class="input3"/>';

html += 'Preço: <input type="text" name="preco[]" class="input4" placeholder="Preço / €" style="margin-right:-5px;"/> ';

html += '<a href="#" id="rem"><img src="../imagens/menos.ico" width="25" height="25"></a></td>';

html += '</tr>';

return html;

}

//Cria a função para adicionar os campos extras de telefone

function createFieldTel(num){

/*

Repare que é informado que terá um parametro;

Será por ele iremos identificar de quem pertence esses campos;

*/

var tel = '<label> Telefone :';

tel += '<input type="text" name="telExtra['+num+'][]" />';

tel += '</label><br />';

return tel;

}

//cria uma função para conta os campos criados

function getTotalItems(){

//Contamos o total de campos, e diminuimos 1

//Porque o array é iniciado seu indice com 0

return $(".items").length - 1;

}

$("#rem").live('click', function(){

//remove a div com classe "items" que está a "segurar" o botão e as caixas que queres eliminar

$(this).parent("td").parent("tr").remove(); //aqui ele remove com remove(); que apaga o elemento todo

return false;

});

//Adiciona os nome e telefone

$("#add").click(function(){

//Adicionado no final do elemento ( #boxFields) os campos

$("#boxFields").append(createDivFields());

return false;

});

//Adiciona os campos extras

$(".addTel").live('click', function(){

/*

Utilizamos Live para atribui o evento click ao link addTel

Isso porque como criamos dinamicamente esse elemento

ele ainda não está no DOM, quando o jQuery vai executar

*/

//Chamamos o contador

var total = getTotalItems();

//Voltamos um elemento (parent);

//e depois buscamos .item, informando que precisa ser o primeiro encontrado

//Adiciona no final do elemento (.item) os novos campos

$(this).parent().children('.item:first').append(createFieldTel(total));

return false;

});

});

</script>

Ajudem-me por favor é muito urgente.

Edited April 19, 2013 at 05:58 PM by Programar

[pmg]

Topico movido para "Duvidas gerais".

Por favor indica que linguagem de programacao (e base de dados, se necessario) estas a usar para se mover para o quadro correcto.