jQuery UI自動完成search（）不顯示DropDownList

Question

給定自動完成小部件的search方法的文檔 ，我希望有一個調用該方法的按鈕將顯示一個包含可用選擇列表的框。 什么都沒發生。

我有以下代碼在文本框中創建自動完成小部件：

$("#StateListCoolBox").autocomplete({
    source: StateListCoolBoxTags,
    focus: function( event, ui ) {
        $("#StateListCoolBox").val(ui.item.label);
        return false;
    },

    select: function( event, ui ) {
        $("#StateListCoolBox").val(ui.item.label);
        $("#StateListCoolBox-id").val(ui.item.value);
        return false;
    }
});

工作正常。

我在要顯示列表的按鈕上附加了以下代碼。 它被調用但是什么都沒有發生：

function StateListCoolBox_dropDownClick() {
    $("#StateListCoolBox").autocomplete("search", "" );
};

我已經用相應的文本框中的文本和空白的文本框對此進行了測試。

如何獲得與DropDown Combo上的按鈕類似的按鈕，以便單擊時顯示可用選擇的列表？

Answer 1

如果您在此查看“查看源代碼”： http : //jqueryui.com/autocomplete/#combobox

你會看見：

  _createShowAllButton: function() {
    var input = this.input,
      wasOpen = false;

    $( "<a>" )
      .attr( "tabIndex", -1 )
      .attr( "title", "Show All Items" )
      .tooltip()
      .appendTo( this.wrapper )
      .button({
        icons: {
          primary: "ui-icon-triangle-1-s"
        },
        text: false
      })
      .removeClass( "ui-corner-all" )
      .addClass( "custom-combobox-toggle ui-corner-right" )
      .on( "mousedown", function() {
        wasOpen = input.autocomplete( "widget" ).is( ":visible" );
      })
      .on( "click", function() {
        input.trigger( "focus" );

        // Close if already visible
        if ( wasOpen ) {
          return;
        }

        // Pass empty string as value to search for, displaying all results
        input.autocomplete( "search", "" );
      });
  }

因此，這通過觸發文本字段上的焦點事件來顯示所有結果。

如何獲得與DropDown Combo上的按鈕類似的按鈕，以便單擊時顯示可用選擇的列表？

我認為這符合您想要實現的目標。 因此，請使用minLength: 0嘗試以下操作minLength: 0 ：

function StateListCoolBox_dropDownClick() {
    $("#StateListCoolBox").trigger("focus").autocomplete( "search", "" );
};

也就是說，您的方法應該沒有問題：

觸發search事件並在未取消事件的情況下調用數據源。 單擊時可被類似選擇框的按鈕用來打開建議。 不帶參數調用時，將使用當前輸入的值。 可以使用空字符串和minLength: 0調用以顯示所有項目。

您當前的代碼只是丟失了： minLength: 0 。 如果您願意，請嘗試兩者。