3

我正在處理這個jQuery自動完成的事情,我無法從結果集中選擇要在點擊文本框後出現的項目。正如你所看到的,代碼返回和item,我看到下拉菜單。 (我會張貼圖片,但我是新的,不能= /) 但我點擊它後,什麼也沒有發生:(喬布洛走了,沒有顯示,但結果只是在該領域的99)無法從JQuery自動完成選擇選項中選擇

這裏是我的代碼:

var techNumber = $('#<%= txtTechNumber.ClientID %>'); 
     techNumber.autocomplete({ 
      source: function(request, response) { 
       $.ajax({ 
        type: "POST", 
        contentType: "application/json; charset=utf-8", 
        url: '<%=ResolveUrl("~/Service/ServiceHelpdesk/") %>srvWebServiceRepository.asmx/FetchTechnicianList', 
        data: "{ 'techNumber':'" + request.term + "' }", 
        dataType: "json", 
        dataFilter: function(data) { return data; }, 
        success: function(data) { 
         if (data.d != null) { 
          response($.map(data.d, function(item) { 
           return { 
            label: highlight(item.TechNumber, request.term) + " - " + item.TechFirstName + " " + item.TechLastName, 
            value: item.TechID 
           } 
          })) 
         } 
        }, 
        error: function(XMLHttpRequest, textStatus, errorThrown) { 
         alert(XMLHttpRequest.responseText); 
        }, 
        select: function(event, ui) { 
         techNumber.val(ui.item); 
        } 
       }); 
      }, 
      minLength: 1 
     }); 

回答

2

而不是使用ui.item的,在你的select處理程序使用ui.item.label。這可能也不會傷害到事件preventDefault事件。最後,確保爲select處理程序的定義裏面的選項對象傳遞給小部件(以前是在AJAX選項對象):

var techNumber = $('#<%= txtTechNumber.ClientID %>'); 
     techNumber.autocomplete({ 
      source: function(request, response) { 
       $.ajax({ 
        type: "POST", 
        contentType: "application/json; charset=utf-8", 
        url: '<%=ResolveUrl("~/Service/ServiceHelpdesk/") %>srvWebServiceRepository.asmx/FetchTechnicianList', 
        data: "{ 'techNumber':'" + request.term + "' }", 
        dataType: "json", 
        dataFilter: function(data) { return data; }, 
        success: function(data) { 
         if (data.d != null) { 
          response($.map(data.d, function(item) { 
           return { 
            label: highlight(item.TechNumber, request.term) + " - " + item.TechFirstName + " " + item.TechLastName, 
            value: item.TechID 
           } 
          })) 
         } 
        }, 
        error: function(XMLHttpRequest, textStatus, errorThrown) { 
         alert(XMLHttpRequest.responseText); 
        } 
       }); 
      }, 
      select: function(event, ui) { 
       event.preventDefault(); 
       techNumber.val(ui.item.label); 
      }    
      minLength: 1 
     }); 
+0

太棒了!這就是問題所在,select:函數出錯了。一旦我將其移動,它就會像本應該那樣工作。非常感謝你的迅速回復。 – GenXisT 2012-01-12 17:58:15

+0

@Nakia:完全沒問題! – 2012-01-12 18:00:18

+0

偉大的職位,這幫助我達到了最後期限!謝謝! – sacredfaith 2013-05-16 06:26:58

0

這一個是一個通用的修復。

你的函數的頂部添加此調用.autocomplete

(function ($) { 

    $(".ui-autocomplete-input").live("autocompleteopen", function() { 
     var autocomplete = $(this).data("autocomplete"), 
     menu = autocomplete.menu; 

     if (!autocomplete.options.selectFirst) { 
      return; 
     } 

     menu.activate($.Event({ type: "mouseenter" }), menu.element.children().first()); 
    }); 

} (jQuery)); 

然後在函數中只需添加一個參數selectFirst: true像以前一樣:

$('#ctl00_PageBody_txtKeywords').autocomplete({ 
     source: function (request, response) { 
      $.ajax({ 
       type: 'POST', 
       url: 'getData.asmx/LoadData', 
       selectFirst: true, 

(PS找不到原始參考,這一定要指向它http://bit.ly/INzcrv