Enviado em 27/08/2019 - 12:03h
[youtube]Por favor... Peço a ajuda de alguém para me ensinar a fazer seletor Jquery funcionar com campos dinâmicos... Eu crio linhas no formulário a partir de um evento que define a quantidade de linhas a nota terá... a partir dai ele cria as linhas e o primeiro campo tem um autocomplete, que funciona! Os demais campos utilizam a informação do auto complete para preencher o restante das informações... Eu crio um looping para criar as linhas e defino as requisições ajax no javascript ... O problema acontece quando seleciono o autocomplete nas linhas adicionais... Por causa do seletor dos campos terem o nome igual... Ou ele muda as informações em todas as demais linhas de uma vez, ou se eu usar eq(z) como seletor ele só altera as demais informações na ultima linha... Já tentei de tudo que se possa imaginar... Preciso de ajuda... O problema é como definir o seletor dos campos dinâmicos, pois tem a mesma class e name...
<div id="origem">
<div class="row">
<div class="col col-md-3">
<div class="input-group">
<input type="text" class="auto form-control" id="autoprod" name="prod[0]" placeholder="Produto...">
<input type="hidden" id="prodid" name="prodid[0]" value="0">
<script type="text/javascript">
$(document).ready(function(){
var i = 0;
$('#autoprod').eq(i).autocomplete({
source: function(request, response) {
$.ajax({
url:'<?php echo base_url().'Compras/prodList'; ?>',
type: 'post',
dataType: 'json',
data: {
search: request.term
},
success: function(data){
response(data);
}
});
},
select: function(event, ui){
$('#autoprod').eq(i).val(ui.item.label);
$('#prodid').val(ui.item.value);
$('#marca').val(ui.item.marc);
$('#unit').val(ui.item.uni);
return false;
}
});
});
</script>
</div>
</div>
<div class="col col-md-2">
<div class="input-group">
<input type="text" class="form-control" id="marca" name="marca[0]" placeholder="Marca..." readonly>
</div>
</div>
<div class="col">
<div class="input-group">
<input type="hidden" class="form-control" id="unit" name="unit[0]" placeholder="Unidade..." readonly>
<input type="text" class="form-control" id="lugar" name="unit2[0]" placeholder="Unidade..." readonly>
<script type="text/javascript">
$(document).ready(function(){
$("#autoprod").on('blur', function() {
var txt = $('#unit').val();
var jtxt = {
'valor1': txt
};
$.ajax({
url: '<?php echo base_url()."Compras/ajax"; ?>',
type: 'post',
data: jtxt,
dataType:'json',
success:function(resultado) {
$("#lugar").val(resultado[0].nome_unit);
},
error:function(){
alert("Este produto não existe... Preencha corretamente o formulário!");
},
});
});
});
</script>
</div>
</div>
<div class="col">
<div class="input-group">
<input type="text" class="form-control money2" maxlength="15" id="valorunit" name="valorunit[0]" pattern="^$?[0-9]+(,[0-9]{3})*(.[0-9]{2})?$" onkeydown="function(money2);" placeholder="Preço Unit. (R$)" required>
</div>
</div>
<div class="col">
<div class="input-group">
<input type="number" class="form-control" id="quant" name="quant[0]" min="1" max="999" placeholder="Quantidade" onblur="mult()" value="1" required>
</div>
</div>
<div class="col">
<div class="input-group">
<input type="text" class="form-control money2" maxlength="15" id="totalp" name="totalp[0]" onfocus="function(money2);" placeholder="Total (R$)" required readonly>
</div>
<script type="text/javascript">
function id(valor_campo) {
return document.getElementById(valor_campo);
}
function getValor(valor_campo) {
var valor = document.getElementById(valor_campo).value.replace('.','');
valor = valor.replace(',','.');
return parseFloat(valor);
}
function mult() {
var total = getValor('valorunit') * getValor('quant');
id('totalp').value = total.toFixed(2);
}
</script>
</div>
</div>
</br>
</div>
<div id="destino">
</div>
<script type="text/javascript">
$(document).ready(function(){
$("#qt").on('blur', function(e) {
e.preventDefault();
document.getElementById("qt").readOnly = true;
document.getElementById("destino").innerHTML="";
var qtr = $("#qt").val();
var i = 1;
while (i < qtr) {
var z = i - 1;
var t = '<div class="row">\<div class="col-3">\<div class="input-group">\<input type="text" class="autot form-control" name="prod[0]" placeholder="Produto...">\<input type="hidden" class="idr" name="prodid[0]" value="0">\</div></div>\<div class="col-2">\<div class="input-group">\<input type="text" class="nname form-control" name="marca[0]" placeholder="Marca..." readonly>\</div></div>\<div class="col">\<div class="input-group">\<input type="hidden" class="uunit form-control" name="unit[0]" placeholder="Unidade..." readonly>\<input type="text" class="form-control" id="lugar" name="unit2[0]" placeholder="Unidade..." readonly>\</div></div>\<div class="col">\<div class="input-group">\<input type="text" class="form-control money2" maxlength="15" id="valorunit" name="valorunit[0]" pattern="^$?[0-9]+(,[0-9]{3})*(.[0-9]{2})?$" onkeydown="function(money2);" placeholder="Preço Unit. (R$)" required>\</div></div>\<div class="col">\<div class="input-group">\<input type="number" class="form-control" id="quant" name="quant[0]" min="1" max="999" placeholder="Quantidade" onblur="mult()" value="1" required>\</div></div>\<div class="col">\<div class="input-group">\<input type="text" class="form-control money2" maxlength="15" id="totalp" name="totalp[0]" onfocus="function(money2);" placeholder="Total (R$)" required readonly>\</div></div></div></br>';
$("#destino").append(t);
$('.autot').autocomplete({
source: function(request, response) {
$.ajax({
url:'<?php echo base_url().'Compras/prodList'; ?>',
type: 'post',
dataType: 'json',
data: {
search: request.term
},
success: function(data){
response(data);
}
});
},
select: function(event, ui){
$(this).val(ui.item.label);
$('.idr').val(ui.item.value);
$('.nname').val(ui.item.marc);
$('.uunit').val(ui.item.uni);
return false;
}
});
i = i + 1;
}
});
});
</script>
Como escolher o melhor escalonador de CPU para melhorar o desempenho da máquina
Curiosidade sobre DOOM Guy e Isabelle de Animal Crossing
Inicializando servidor Ubuntu na AWS e rodando apache em Container
Instalando TeamViewer no Debian 12
Conheça o Octopi, outro frontend para o Pacman com acesso ao AUR (Arch Linux e derivados)
Terminal transparente no Debian 12 com interface i3wm usando Xfce4-Terminal e Compton
Ubuntu simplesmente morreu (8)
Como colocar uma assinatura digital em um código compilado ! (2)
Como traduzir todo o nitrogen para BR? (1)
Eu estou com problemas para usar o QBASIC no Dosbox X (1)
Como eu posso logar noutra distro sem subir o sistema? [RESOLVIDO] (5)