如何有選擇地禁用jquery ui自動完成？

我確定有一個簡單的解決方案，但我似乎無法找到它。我正在使用jquery ui自動完成進行數據庫搜索。自動完成建議數據庫中存在的單詞/短語，以幫助用戶構建更好的搜索查詢。我有一個選擇字段，它可以更改自動完成的來源以搜索不同的表格，這些表格都可以很好地工作。如何有選擇地禁用jquery ui自動完成？

但對於選擇的選項之一，我需要禁用自動完成功能，返回的文本字段只是純醇」正常的文本字段的功能。我想我可以將它包裝在select語句中的if語句中，但是這會導致各種意想不到的行爲 - 如果更改爲其他選項，自動完成功能將不起作用。

什麼是最好的方法呢？

$(function() { 
     var select = $("#selectType"), 
     options = select.find("option"), 
     songSearchField = $("#songSearchField"); 

     var selectType = options.filter(":selected").attr("value"); 

     songSearchField.autocomplete({ 
      source: "/ajax/songLookup.php?selectType=" + selectType, 
      minLength: 2, 
      select: function(e, ui) { 
       e.preventDefault() 
       var searchTerm = ui.item.value; 
       var existingTerms = $("#searchString").val() + searchTerm + ", "; 
       $("#searchString").val(existingTerms); 
       $(this).val(''); 
       }, 
      change: function() { 
       // clear the search field 
       $("#songSearchField").val(''); 
       } 
     }); 

     $("#songSearchField").on("autocompleteclose", function(e, ui) { 
      var existingTerms = $("#searchString").val(); 
      $("#termsDisplay").html("<b>Terms: </b>" + existingTerms); 
     }); 

     select.change(function() { 
      $('#searchString').val(''); 
      $("#songSearchField").val(''); 
      $("#termsDisplay").html(''); 
      $("#content").html(''); 
      selectType = options.filter(":selected").attr("value"); 
      songSearchField.autocomplete("option", "source", "/ajax/songLookup.php?selectType=" + selectType); 

      //// this is where I run into trouble \\\\ 
      if(selectType = 'desc') { 
       songSearchField.autocomplete("disable"); 
      } 
      else { 
       songSearchField.autocomplete("option", "source", "/ajax/songLookup.php?selectType=" + selectType); 
      } 
     }); 
    });

這裏是HTML。

<form id="songSearchForm"> 
     <input type="text" name="songSearchField" id="songSearchField" /><br /> 
     <select name="selectType" id="selectType"> 
      <option value="keyword">Keyword Search</option> 
      <option value="desc">Song Description Search</option> 
      <option value="title">Song Title Search</option> 
     </select> 
     <input type="hidden" name="searchString" id="searchString" value="" /> 
     <p id="termsDisplay"></p> 
     <input type="submit" name="submit" value="Search" /> 
     <input type="button" name="clear" id="clear" value="Clear Search" /> 
    </form>

來源

2013-04-12 Chapman

如何使用兩個不同的輸入 - 簡單的一個幷包裝到'autocomplete'中，而不是根據選擇的選項切換其可見性？ – raina77ow

哪一個選項是你不想讓它工作的選項？ – j08691

我發現解決方案（除了明顯的錯字Loren指出）。在禁用自動完成之後，您必須首先在else語句中發送啓用選項。 – Chapman

兩件事情：

if(selectType = 'desc') {

應該

if(selectType == 'desc') {

而且，我看到你在禁用自動完成，但我沒有看到你在哪裏重新啓用它。試試這個：

if(selectType == 'desc') { 
    songSearchField.autocomplete("disable"); 
} else { 
    songSearchField.autocomplete("enable"); 
    songSearchField.autocomplete("option", "source", "/ajax/songLookup.php?selectType=" + selectType); 
}

編輯 - 我最初刪除了行來改變源代碼，但第二眼，我認爲你確實需要它。當然，你只需要一次。無論是在這份聲明中，還是上面的一個。

來源

2013-04-12 15:36:30

賓果 - 我剛剛發現。但你得到了金星。謝謝！ – Chapman

如何刪除您第一次調用此，下方您selectType = options....:

songSearchField.autocomplete("option", "source", "/ajax/songLookup.php?selectType=" + selectType);

並改變你的if語句這樣：

//// this is where I run into trouble \\\\ 
if(selectType != 'desc') { 
songSearchField.autocomplete("option", "source", "/ajax/songLookup.php?selectType=" + selectType); 
}

或者......我只注意到這

這個：

if(selectType = 'desc') {

應該是這樣的：

if(selectType == 'desc') {

來源

2013-04-12 15:27:47 99823

如何有選擇地禁用jquery ui自動完成？

回答

相關問題