Ajax меняет переменную автоматически

Question

У меня тут проблема.Я обнаружил, что глобальная переменная меняется каждый раз, когда она попадает в ajax.

$(document).on("keyup input", ".product-id", function () {
  var id_prod = this.id.replace('prod_id_', '');

  console.log('id_prod (outside ajax): ', id_prod);

  var inputVal = $(this).val();
  var resultDropdown = $('#result2').css({
      "display": "block"
    });

  if (inputVal.length) {
    $.ajax({
      type: 'POST',
      data: {  term: inputVal },
      url: 'backend-search-inv.php',

      success: function (data) {
        resultDropdown.html(data);

        $(document).on("click", "#result2 p", function () {
          var inv_id = $(this).text();
          //console.log('inv_id: ',inv_id);

          $.ajax({
            type: 'POST',
            data: {
              term: inv_id
            },
            url: 'autocomplete_inv.php',
            success: function (response) {
              var inv_info = jQuery.parseJSON(response);

              console.log('id_prod (in ajax): ', id_prod);

            },
            error: function () {
              console.log('Unable to access database.');
            }
          });

        }); //end of result being clicked
      }
    });
  } 
  else {
    resultDropdown.empty();
  }
});

Я не понимаю, почему переменная id_prod увеличивается каждый раз, когда она входит в ajax.Вот скриншот console.log.

Ссылаясь на скриншот, каждый раз, когда я хочу что-то ввести в id_prod = 2, ajax всегда заканчивал тем, что обновлял id_prod = 1, а затем id_prod = 2 снова автоматически, что приведет к дублированию моих данных.

Может ли кто-нибудь помочь мне в этом?

Answer 1

Итак, я просто объявляю id_prod как глобальную переменную и присваиваю 0 как значение по умолчанию.Затем для id_prod в основном присваивается новое значение, как только оно присутствует в событии * 1003. *

Спасибо Мохамеду Юсефу за его ответ в разделе комментариев моего собственного вопроса!

    //DECLARE id_prod as a global variable...
var id_prod = 0;

$(document).on("keyup input", ".product-id", function(){

    id_prod = this.id.replace('prod_id_', '');
    var inputVal = $(this).val();
    var resultDropdown = $('#result2').css({"display":"block"});

    if(inputVal.length){
         $.ajax({
            type: 'POST',
            data: {term:inputVal},
            url: 'backend-search-inv.php',
            success: function(data){
                resultDropdown.html(data);
            }
        });
    }
    else{
        resultDropdown.empty();
    }
});

// WHEN RESULT BEING CLICKED...
$(document).on("click", "#result2 p", function(){
    var inv_id = $(this).text();

    $.ajax({
        type: 'POST',
        data: {term:inv_id},
        url: 'autocomplete_inv.php',
        success: function (response) {
            var inv_info = jQuery.parseJSON(response);

            console.log('id_prod (in ajax): ',id_prod);

            $('#prod_id_'+id_prod).val(inv_info[0]);
            $('#prod_qty_'+id_prod).val(1);
            $('#prod_disct_'+id_prod).val(0);
            $('#prod_type_'+id_prod).val(inv_info[1]);
            $('#prod_colour_'+id_prod).val(inv_info[2]);
            $('#prod_price_'+id_prod).val(inv_info[3]);

            $('#result2').empty();

            sumPrice();
        },
        error: function(){
            console.log('Unable to access database.');
        }
    });});