Amigos, estou com problemas para gravar no MySQL campos clonados no formulário. Vou tentar explicar com detalhes pra ver se os amigos conseguem me ajudar.
<div class="mb-md">
<a href="#" id="but_add">
<i class="fa fa-plus text-primary"></i>
<span class="text-semibold text-primary"> Adicionar Categoria</span>
</a>
</div>
<div class="categoria row" id="categoria">
<section class="panel panel-border">
<header class="panel-heading">
<div class="pull-right">
<a href="#" class="text-primary text-semibold remove-categoria">Excluir</a>
</div>
<input type="text" name="ds_categoriacomp[]" class="form-control-small-height" placeholder="Nome" data-plugin-maxlength maxlength="100" required>
<div class="row col-padding-top-x15">
<div class="col-md-6">
<div class="form-group">
<label class="col-md-1 control-label">Qtd.</label>
<div class="col-md-8">
<div class="input-group">
<span class="input-group-addon">min</span>
<input type="number" id="qtd_min" name="qtd_min[]" value="0" min="0" max="99" maxlength="2" step="1" required="required" class="form-control-small-height qtd_min"/>
<span class="input-group-addon">máx</span>
<input type="number" id="qtd_max" name="qtd_max[]" min="1" max="99" maxlength="2" step="1" required="required" class="form-control-small-height"/>
</div>
</div>
</div>
</div>
<div class="col-md-4 pull-right custom-padding-top-x7">
<div class="checkbox-custom checkbox-default">
<input type="checkbox" name="cd_obrigatorio[]"/>
<label>Obrigatório</label>
</div>
</div>
</div>
</header>
<div class="panel-body">
<div class="row" style="margin-top:-15px;">
<table class="table mb-none tb-complementos" id="tb-complementos">
<tr>
<td class="actions col-sm-2">
<input id="ds_complemento" name="ds_complemento[]" placeholder="Nome" class="form-control-small-height" data-plugin-maxlength maxlength="100" required>
</td>
<td class="actions col-lg-4">
<input id="ds_descComp" name="ds_desccomp[]" placeholder="Descrição" class="form-control-small-height" data-plugin-maxlength maxlength="2000" required>
</td>
<td class="actions text-center col-lg-1">
<input id="vl_valorcomp" name="vl_valorcomp[]" class="form-control-small-height" placeholder="Preço" onkeyup="formatarMoeda(this);" onChange="carregaPrValor(this.value);" required>
</td>
<td class="actions text-center col-lg-1">
<a href="#" class="remove-complemento">
<span class="text-semibold">Excluir</span>
</a>
</td>
</tr>
</table>
<a href="#" id="but_add_c" class="but_add_c" style="padding-left:10px;">
<i class="fa fa-plus text-dark"></i>
<span class="text-semibold text-dark"> Adicionar complemento</span>
</a>
</div>
</section>
</div>
O HTML acima, gera formulário na imagem abaixo:
Ao clicar em Adicionar complemento, a função js faz um clone dos campos complementos conforme a imagem abaixo:
Ao clicar em Adicionar categoria a funcão js gera um clone do formulário completo, onde dentro deste formulário "clone" eu posso adicionar mais complementos e assim por diante. Figura abaixo:
Aí é onde ocorre o problema. Como posso salvar no banco de dados visto que são duas tabelas, tabela1 grava o nome da categoria e tabela2 grava os complementos.
Abaixo a forma como estou tentando fazer no PHP, mas sem sucesso:
for($i = 0; $i < count($nomecategoria); $i++){
mysql_query("insert into tabela1 (nomecategoria, valor1, valor2...)values('".$nomecategoria[$i]."', '".$valor1[$i]."', '".$valor2[$i]."')");
//busca id da categoria gerado no insert
$idcategoria = mysql_insert_id();
}
for($c = 0; $c < count($nomecomplemento); $c++){
mysql_query("insert into tabela2 (idcategoria, nomecomplemento, descricao)values('".$idcategoria."', '".$nomecomplemento[$c]."', '".$descricao[$c]."')");
}
O código acima salva as categorias na tabela1 corretamente, mas ao salvar os complementos na tabela2 o idcategoria fica sempre igual.
JavaScript que faz o clone dos objetos:
//add categoria complemento/////////////////////////////////
$(document).ready(function(){
$('#but_addcategoria').click(function(){
var newel = $('.categoria:last')
.clone(true)
.find("input").val("").end()
$(newel).insertAfter(".categoria:last");
});
});
//add item complemento
$(document).ready(function(){
$('#but_addcomplemento').click(function(){
var newel = $('.tb-complementos:last')
.clone(true)
.find("input").val("").end();
$(newel).insertBefore(this);
});
});
Existe uma forma ideal para fazer esses inserts de maneira que cada complemento fique com seu idcategoria correto?
Desde já agradeço os amigos que tentarem ajudar.