【问题标题】:Response not working inside ajax autocomplete响应在ajax自动完成中不起作用
【发布时间】:2018-04-09 16:47:53
【问题描述】:

我正在使用自动完成插件http://jqueryui.com/autocomplete/#remote-jsonp

  $("#city" ).autocomplete({
     source: function( request, response ) {
      $.ajax({
        url: 'index.php?secController=studentProfile&action=employeeSearch',
        dataType: "JSON",
        data: {
        searchCriteria: request.term
        },
        success: function( data ) {
        console.log(data);
        response(data, function (item) {
        return {
            label: item.FulltName,
            value: item.id
        };
       });
      }
    });
  },
  minLength: 1,
  select: function( event, ui ) {
    log( ui.item ?
      "Selected: " + ui.item.label :
      "Nothing selected, input was " + this.value);
  },
  open: function() {
    $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
  },
  close: function() {
    $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
  }
});

控制台中的数据是用多个json数据获取的,比如

     0: {_id: {…}, FullName: "Aasiya Rashid Khan", FirstMiddle: "Aasiya Rashid", FirstLast: "Aasiya Khan", Employee: {…}}
     1:{_id: {…}, FullName: "Sana Jeelani Khan", FirstMiddle: "Sana Jeelani", FirstLast: "Sana Khan", Employee: {…}}
     2:{_id: {…}, FullName: "Asad Hussain Khan", FirstMiddle: "Asad Hussain", FirstLast: "Asad Khan", Employee: {…}}

其中一位员工的 id 类似于 "_id:{$oid: "5aa75d8fd2ccda0fa0006187"}"

在上面的代码中,我试图返回 item.FullName 作为自动完成的标签和 _id 作为值。他们不工作。请帮忙!!!

【问题讨论】:

    标签: javascript jquery ajax autocomplete


    【解决方案1】:

    response 回调需要一个参数,这里你提供了两个。我认为您正在尝试将返回的 JSON 映射到所需的输出,请尝试:

    response(
        data.map(item => ({
            label: item.FullName,
            value: item._id
        }))
    )
    

    【讨论】:

    • 感谢您的解决方案。输入不可搜索的数据时,它有时会挂起。
    • 在这些情况下从console.log(data) 打印出什么?
    • 对象结果:“空”
    • 您可能应该更新 php 端点以返回一个空数组而不是字符串 'empty'
    • 感谢您的回答
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-05-06
    • 1970-01-01
    • 2017-12-29
    • 2017-12-07
    • 2010-10-14
    • 2017-03-03
    • 1970-01-01
    相关资源
    最近更新 更多