2012-08-09 33 views
5

Tôi đã triển khai tự động hoàn tất bằng jquery-ui. Tôi muốn giới hạn số lượng mục được hiển thị là 10 và mỗi mục được định dạng tùy chỉnh. Đây là mã sốjquery-ui-autocomplete - Ghi đè _renderMenu và _renderItem

$("#text1").autocomplete({ 
    minLength: 2, 
    source: function (request, response) { 
    var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i") 
    , results = []; 
    $.each(source, function (i, value) { 
    if (matcher.test(value.value) && $.inArray(value.label, results) < 0) { 
    results.push(value.label); 
    } 
    }); 

    response(results); 
    } 
}).data("autocomplete") 
     ._renderMenu = function(ul, items) { 
     var self = this; 
     $.each(items, function (index, item) { 
      if (index < 10) { 
       $.ui.autocomplete.prototype._renderItem = function(ul, item) { 
       var re = new RegExp("^" + this.term, "i"); 
       var t = item.label.replace(re, "<span style='font-weight:bold;color: Blue;'>" + "$&" + "</span>"); 
       var listItem = $("<li></li>") 
           .data("item.autocomplete", item) 
           .append("<a>" + t + "</a>") 
           .appendTo(ul); 
       return listItem; 

       } 
      } 
      }); 
     }; 

Điều này có vẻ không hoạt động vì nó không ném bất kỳ kết quả nào. Bất kỳ trợ giúp về điều này?

Trả lời

5

Tôi đã tìm ra. Dường như tôi phải ghi đè cả _renderMenu và _renderItem. Nó hoạt dộng bây giờ.

+0

Xin chào Anit, tôi đang gặp sự cố tương tự. Bất kỳ cơ hội nào bạn có thể đăng mã hoạt động? –

+1

@ Beetroot-Beetroot Bạn đã ghi đè lên _renderMenu và _renderItem. Mã đã được đào sâu. Nhưng đây là tài liệu tham khảo mà bạn có thể xem xét http://stackoverflow.com/questions/2435964/jqueryui-how-can-i-custom-format-the-autocomplete-plug-in-results –

+1

@Akit, cảm ơn bạn vì trả lời nhanh của bạn. Trong thời gian chờ đợi, tôi nhận được kết quả bằng cách gọi '._renderItemData' từ' ._renderMenu' để tạo lại hành vi chuẩn của plugin. Điều này là thích hợp trong trường hợp của tôi, vì tôi muốn các mục menu chuẩn bog nhưng với các dấu phân tách để chia menu thành các phần. Cảm ơn một lần nữa. –