自動完成文本框不顯示文本框內點擊結果

Question

我有一個autocompletetextbox它正是我想要搜索的過濾器。但現在我想的是，

如果用戶沒有任何類型進入textbox，只是點擊textbox。它應該顯示所有的結果。這是可能的嗎？

以下是我的代碼。

$(document).ready(function() { 
     SearchText(); 
    }); 
    function SearchText() { 
     $("#txt712").autocomplete({ 
      source: function (request, response) { 
       $.ajax({ 
        type: "POST", 
        contentType: "application/json; charset=utf-8", 
        url: "Frm_Agreement_Master.aspx/GetAutoCompleteData", 
        data: "{'username':'" + extractLast(request.term) + "'}", 
        dataType: "json", 
        success: function (data) { 
         response(data.d); 
        }, 
        error: function (result) { 
         alert("Error"); 
        } 
       }); 
      }, 
      focus: function() { 
       return false; 
      }, 
      select: function (event, ui) { 
       var terms = split(this.value); 
       terms.pop(); 
       terms.push(ui.item.value); 
       terms.push(""); 
       this.value = terms.join(", "); 
       return false; 
      } 
     }); 
     $("#txt712").bind("keydown", function (event) { 
      if (event.keyCode === $.ui.keyCode.TAB && 
       $(this).data("autocomplete").menu.active) { 
       event.preventDefault(); 
      } 
     }) 
     function split(val) { 
      return val.split(/,\s*/); 
     } 
     function extractLast(term) { 
      return split(term).pop(); 
     } 
    } 

另請參閱我從哪裏獲得參考的鏈接。

Reference link

UPDATE

服務器端代碼

[WebMethod] 
public static List<string> GetAutoCompleteData(string username) 
{ 
    List<string> result = new List<string>(); 
    using (OracleConnection ObjPriCon = new OracleConnection(System.Configuration.ConfigurationManager.ConnectionStrings["OracleConn"].ToString())) 
    { 
     using (OracleCommand cmd = new OracleCommand("select distinct survey_area_7_12 FROM xxcus.xxacl_pn_farming_mst WHERE survey_area_7_12 LIKE '%' || :searchtext || '%'", ObjPriCon)) 
     { 
      ObjPriCon.Open(); 
      cmd.Parameters.AddWithValue(":searchtext", username.ToLower()); 
      OracleDataReader dr = cmd.ExecuteReader(); 
      if (dr.HasRows) 
      { 
       while (dr.Read()) 
       { 
        result.Add(dr["survey_area_7_12"].ToString()); 
       } 
      } 
      return result; 
     } 
    } 
} 

Answer 1

在服務器代碼檢查，如果搜索字符串爲空或不是，並觸發查詢accorduingly

public static List<string> GetAutoCompleteData(string username) 
    { 
    List<string> result = new List<string>(); 
    using (SqlConnection con = new SqlConnection("Data Source=SureshDasari;Integrated Security=true;Initial Catalog=MySampleDB")) 
    { 

    **//check if user name is not null** 
    if(null != username){ 
    using (SqlCommand cmd = new SqlCommand("select DISTINCT UserName from UserInformation where UserName LIKE '%'+@SearchText+'%'", con))} 
    else{ 
     using (SqlCommand cmd = new SqlCommand("select UserName from UserInformation, con))} 
} 
    { 
    con.Open(); 
    cmd.Parameters.AddWithValue("@SearchText", username); 
    SqlDataReader dr = cmd.ExecuteReader(); 
    while (dr.Read()) 
    { 
    result.Add(dr["UserName"].ToString()); 
    } 

Answer 2

你可以使用「焦點」事件來做到這一點。

.focus(function() { 
    $(this).autocomplete("search"); 
}); 

完整代碼如下。

$("#txt712").autocomplete({ 
     source: function (request, response) { 
      $.ajax({ 
       type: "POST", 
       contentType: "application/json; charset=utf-8", 
       url: "Frm_Agreement_Master.aspx/GetAutoCompleteData", 
       data: "{'username':'" + extractLast(request.term) + "'}", 
       dataType: "json", 
       success: function (data) { 
        response(data.d); 
       }, 
       error: function (result) { 
        alert("Error"); 
       } 
      }); 
     }, 
     focus: function() { 
      $(this).autocomplete("search"); //New Code 
     }, 
     select: function (event, ui) { 
      var terms = split(this.value); 
      terms.pop(); 
      terms.push(ui.item.value); 
      terms.push(""); 
      this.value = terms.join(", "); 
      return false; 
     } 
    });