JSON UI Tự động hoàn thành JSON cung cấp lỗi: Loại lỗi không bắt buộc: Không thể sử dụng toán tử 'in' để tìm kiếm '62' trong

Question

Tôi đang gặp phải rất nhiều sự cố khi tự động hoàn thành để hoạt động trên trang của mình. Khi tôi nhập 2 ký tự ("OW") vào đầu vào tìm kiếm của mình, tôi nhận được hình ảnh trình tải trước (xem bên dưới), nhưng nó không bao giờ biến mất và tôi không bao giờ nhận được popup tự động hoàn thành. Nhìn vào giao diện điều khiển trong Chrome sẽ hiển thị:

Uncaught TypeError: Cannot use 'in' operator to search for '62' in [{"value":103,"label":"FLOWER"},{"value":105,"label":"YELLOW"}] 

Đây là chuỗi thực tế đang được trả lại (xác nhận bằng cách bổ sung một cảnh báo (dữ liệu) trong khối thành công):

[{"kwrdID":103,"kwrdKeyWord":"FLOWER"},{"kwrdID":105,"kwrdKeyWord":"YELLOW"}] 

Đây là chính mã cho tự động hoàn tất

$("#searchInput").autocomplete({ 
source: function (request, response) { 
    $.ajax({ 
     url: '@Url.Action("GetKeywords", "Home")', 
     dataType: "json", 
     data: { 
      SearchTerm: request.term 
     }, 
     success: function (data) { 
      response($.map(data.keywords, function (item) { 
       return { 
        label: item.kwrdKeyWord, 
        value: item.kwrdID 
       } 
      })); 
     } 
    }); 
}, 
    minLength: 2 
}); 

Và cuối cùng, đây là trình tải trước (chỉ trong trường hợp nó liên quan).

$(document).ajaxStart(function() { 
    var position = $('#divParent').position(); 
    position.left += (($('#divParent').width()/2) - ($('#preloader').width()/2)); 
    position.top += (($('#divParent').height()/2) - ($('#preloader').height()/2)); 
    $('#preloader').css(position).show(); 
    $('#preloader').show(); 
}).ajaxStop(function() { 
    $('#preloader').hide(); 
}); 

Mọi người có thể giúp giải thích những gì đang xảy ra ở đây không?

Answer 1

Đó là một con đường dài, nhưng sau nhiều giờ thử nghiệm tôi đã đưa ra với mã này:

$("#searchInput").autocomplete({ 
    source: function (request, response) { 
     $.ajax({ 
      url: '@Url.Action("GetKeywords", "Home")', 
      dataType: "json", 
      data: { 
       SearchTerm: request.term 
      }, 
      success: function (data) { 
       var parsed = JSON.parse(data); 
       var newArray = new Array(parsed.length); 
       var i = 0; 

       parsed.forEach(function (entry) { 
        var newObject = { 
         label: entry.kwrdKeyWord 
        }; 
        newArray[i] = newObject; 
        i++; 
       }); 

       response(newArray); 
      }, 
      error: function (message) { 
       response([]); 
      } 
     }); 
    }, 
    minLength: 2 
}); 

Điều này dường như làm việc tốt. Sự thật là từ khóa của tôi là duy nhất, vì vậy tôi có thể sống mà không có ID anyway.

Answer 2

một chút giúp đỡ có thể hữu ích:

nếu bạn đang sử dụng json, nó có thể là những "đối tượng json" không được phân tích cú pháp, hoặc bạn đã ghi đè biến với Tings người khác (giống như những gì Gần đây tôi đã ngu ngốc).

cho vấn đề đầu tiên, hãy chắc chắn rằng máy chủ của bạn biết "application/json" kiểu MIME, tiêu đề sử dụng khác (cho PHP)

Ý tôi là, trong PHP, sử dụng này trước khi tất cả:

header("Content-type: application/json"); 

Answer 3

đây cách bạn sử dụng các chức năng cho các tài sản nguồn

source:function(request,response) { 
    var url = "your url"; 
    var postdata = "your data"; // normally you might use request.term to get the current user input 
    $.ajax({url:url,data:postdata,success:function(responsedata){ 
     response($.parseJSON(responsedata)) 
    }}); 
} 

chức năng trả lời chấp nhận mảng của các đối tượng JSON

Answer 4

thay vì viết thay thế data.keywords bằng JSON.parse(data) tại dòng này: response($.map(data.keywords, function (item) {.

BR, Hazem