Hello! I'm having a problem with JS which is as follows: The focusout event is not activating $ .ajax
JS:
$('.focusout_input_budget').focusout(function () {
var amount = $(this).val(),
id = $(this).parent('.line-table-products').attr('data-id'),
nomeprod = $(this).parent('.line-table-products').find('.coll1-line-product-list').html();
if (amount > 0) {
$.ajax({
url : SITE + 'addbudget',
type: "POST",
dataType: "JSON",
data: { id: id, amount: amount, nomeproduto: nomeproduto },
async: false,
success: function (json) {
json = json;
if (json['true'] === 'true') {
$('.icon-inform-budge').html(json['quant']);
console.log(json['quant']);
if (json['quant'] == 1) {
$('#products-budge-top li').first().remove();
var li = "<li class='item-product-budge-top'>"+json['nome']+"</li>";
$('#products-budge-top').append(li);
}
if (json['quant'] > 1 && json['quant'] <= 5) {
$('#products-budge-top li').last().remove();
var li = "<li class='item-product-budge-top'>"+json['nome']+"</li>";
$('#products-budge-top').append(li);
}
if (json['quant'] == 6) {
$('#products-budge-top li').last().remove();
var li = "<li class='item-product-budge-top'>Ver todos os produtos...</li>";
$('#products-budge-top').append(li);
}
if(json['quant'] >= 6){
$('#products-budge-top li').first().remove();
var li = "<li class='item-product-budge-top'>"+json['nome']+"</li>";
$('#products-budge-top').append(li);
}
var link = SITE + 'carrinho';
var last = "<li class='item-product-budge-top'><a href='"+link+"' title='acessar carrinho' class='button-budget-budge-top'>Revisar Orçamento</a></li>";
$('#products-budge-top').append(last);
$(this).html('ADICIONADO COM SUCESSO');
setTimeout(function(){
$('.button-add-product-budget').html('ADICIONAR AO ORÇAMENTO');
},200);
} else {
$(this).html('ERRO AO ADICIONAR');
setTimeout(function(){
$('.button-add-product-budget').html('ADICIONAR AO ORÇAMENTO');
},2000); }
}
});
} else {
$.ajax({
url : SITE + 'removebudget',
type: "POST",
dataType: "JSON",
data: { id:id },
async: false,
success: function(json){
json = json;
if(json == 'true'){
location.reload();
}
}
});
}
});
html:
<ul id="main-products">
<li class="line-table-products line-title-table-products">
<span class="coll-line-product coll-title-line-product coll1-line-product">NOME DO PRODUTO</span>
<span class="coll-line-product coll-title-line-product coll2-line-product">UNIDADE</span>
<span class="coll-line-product coll-title-line-product coll3-line-product">QUANTIDADE</span>
<span class="coll-line-product coll-title-line-product coll4-line-product">ADICIONAR AO MEU ORÇAMENTO</span>
</li>
<?php foreach($produtos as $prod){ ?>
<li class="line-table-products" data-id="<?php echo $prod->codigo; ?>">
<span class="coll-line-product coll1-line-product coll1-line-product-list <?php if(check_size_line($prod->nome, 36, 'space') == 'true') echo 'item-large-size-products'; ?>"><?php echo $prod->nome; ?></span>
<span class="coll-line-product coll2-line-product"><?php echo $prod->unidade; ?></span>
<div class="coll-line-product coll3-line-product">
<img src="<?php echo IMG . 'px.png'; ?>" alt="Icone diminui quantidade" data-operation="subtraction" class="icon-amount-product-budget icon-decrease-product-budget" />
<input type="text" name="productqtd" value="<?php echo check_prod_in_budget($prod->codigo); ?>" placeholder="00" class="input-amount-product-budget focusout_input_budget"/>
<img src="<?php echo IMG . 'px.png'; ?>" alt="Icone diminui quantidade" data-operation="sum" class="icon-amount-product-budget icon-increase-product-budget" />
</div>
<span class="coll-line-product coll4-line-product button-add-product-budget">ADICIONAR AO ORÇAMENTO</span>
</li>
<?php } ?>
</ul>
Could Someone Help Me?