将数据从ajax成功传递到外部else / if语句

时间:2018-08-30 18:48:56

标签: javascript jquery json ajax

我在从ajax成功函数中获取适当的结果并将其传递给要使用的外部函数时遇到问题。

我目前正在接受用户输入,以通过ajax查询数据源并返回该对象,效果很好。我将结果附加到一个选项列表,该列表也可以正常工作。但是,当我单击对象时,我想将与该对象关联的数据传递给ajax调用之外的if / else中的以下行:

$("#groupName").val(result[$(foundOption).attr('srindex')]._source.name);

所以我的选项是正确的,并且当我单击一个选项时,它反映了控制台中被单击的选项。问题是,显然我没有将结果正确传递到我的else if中。

我的_source的继承结构是正确的,但是我只是不知道如何更改我的.val参数以获取正确的值。

有什么想法吗?

$('#productInput').on('input', function () {
  let _this = $(this);
  let foundOption;
  let optSelector = `option[value='${_this.val()}']`;
  if (_this.val() === '') {
    return;
  } else if ((foundOption = $('#returnedProducts').find(optSelector)).length) {
    console.log(optSelector); //this prints the option[value] of the clicked value as it should
    $("#groupName").val(result[$(foundOption).attr('srindex')]._source.name);
    $("#groupNum").val(result[$(foundOption).attr('srindex')]._source.code);
  } else {

    const searchResult = $(this).val(); 
    $.ajax({ url: '/account/autocomplete', 
      data: {
        search_result:searchResult
      },
      "_token": "{{ csrf_token() }}",
      type: "POST", 
      success: function (response) {
        console.log(response);

        console.log(searchResult);
        $("#returnedProducts").empty();

        let result = response.hits.hits;

        console.log(result);
        for(let i = 0; i < result.length; i++) {
          $("#returnedProducts").append("<option srindex=" + [i] + " value=" + result[i]._source.name + ">" + result[i]._source.name + "</option>");


        }
      }
    });
  }
});

我的对象看起来像这样

hits
  hits
    _source
      name
      code

1 个答案:

答案 0 :(得分:1)

您可以将input#groupName的值附加到_this.val()。 另请注意(foundOption = $('#returnedProducts').find(optSelector)).length此代码段没有进行任何条件检查,而只是分配了一个值

$('#productInput').on('input', function() {
  let _this = $(this);
  let foundOption;
  let optSelector = `option[value='${_this.val()}']`;
  if (_this.val() === '') {
    return;
  } else if ($('#returnedProducts').find(optSelector).length) {
    $("#groupName").val(_this.val());
  } else {

    const searchResult = $(this).val();
    $("#returnedProducts").empty();
    var result = [{
      _source: {
        "name": "cat",
      },

    }, {
      _source: {
        "name": "cat1",
      },

    }, {
      _source: {
        "name": "cat2",
      },

    }, {
      _source: {
        "name": "cat33",
      },

    }];
    for (let i = 0; i < result.length; i++) {
      $("#returnedProducts").append("<option srindex=" + [i] + " value=" + result[i]._source.name + ">" + result[i]._source.name + "</option>");

    }
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="productInput" list="returnedProducts">
<datalist id="returnedProducts"></datalist>
<input id="groupName">