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>
Atualizar o macOS no Mac - Opencore Legacy Patcher
Crie alias para as tarefas que possuam longas linhas de comando - bash e zsh
Criando um gateway de internet com o Debian
Configuração básica do Conky para mostrar informações sobre a sua máquina no Desktop
Aprenda a criar músicas com Inteligência Artificial usando Suno AI
Instalando e usando o Dconf Editor, o "regedit" para Linux
Como instalar o navegador TOR no seu Linux
validando quandidade de leitura no read[DUVIDA] (8)
PROBLEMA COM SCRIPT USANDO SED {DÚVIDA}. (2)
O que eu faço com o pen drive de 200mb? (4)
Qual a relevancia dos valores de bogomips com os Mhz e Ghz[DUVIDA] (9)