自动完成文本框在单击文本框时不显示结果

Posted 2023-05-08

【中文标题】自动完成文本框在单击文本框时不显示结果

【英文标题】：Autocomplete textbox don't show result inside clicking of textbox

【发布时间】：2017-02-12 10:46:34

【问题描述】：

我有一个autocomplete textbox，它可以准确过滤我想要搜索的内容。但现在我想要的是，

如果用户没有在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

更新

服务器端代码

[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;
        
    

【问题讨论】：

这可以在服务器端完成。我检查了参考链接和 'C# execution sql query' 。通过验证搜索字符串是否为空，您已修改查询以获取所有结果（选择 *，而不是选择 distinct）并将所有结果发送到前端并填充

@Mehavel：好的，你能帮我写一些代码吗？我无法想象到底要做什么。

@Div：是的，这是有道理的，如果我在这里得到一些代码来想象，它将对我有更多帮助

【参考方案1】：

在服务器代码中检查搜索字符串是否为空并相应地触发查询

    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());
    

【讨论】：

我不明白你的代码。我应该使用它并检查吗？

嗯。当您搜索字符串 ('username') 为空时，只需将查询更改为“从用户表中选择用户名”即可返回所有结果。如果您要搜索的列不可为空，则 ''(empty) 搜索字符串不会有任何结果

我猜它不会起作用，除非在文本框的点击内调用了一些事件。 Coz，当我单击您的代码时不会触发任何事件

【参考方案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;
        
    );