如何使用 ASP.NET 从 MSSQL 中获取 JQuery 自动完成小部件的数据

Posted

技术标签:

【中文标题】如何使用 ASP.NET 从 MSSQL 中获取 JQuery 自动完成小部件的数据【英文标题】:How to use ASP.NET to get data from MSSQL for JQuery Autocomplete widget 【发布时间】:2019-03-27 16:29:35 【问题描述】:

我下载了 jquery-ui 以使用自动完成小部件,并且我想从 MSSQL 数据库中获取项目。但我不知道如何在带有 sql 的 ASP.NET 中使用它。代码基本如下。

        var availableTags = [
            "ActionScript",
            "AppleScript",
            "Asp",
            "BASIC",
            "C",
            "C++",
            "Clojure",
            "COBOL",
            "ColdFusion",
            "Erlang",
            "Fortran",
            "Groovy",
            "Haskell",
            "Java",
            "javascript",
            "Lisp",
            "Perl",
            "php",
            "Python",
            "Ruby",
            "Scala",
            "Scheme"
        ];
        $("#autocomplete").autocomplete(
            source: availableTags
        );
 <div>
        <input id="autocomplete" title="type &quot;a&quot;">
    </div>

编辑:只需了解如何操作即可。只需使用以下代码将 jquery 复制到服务器端:

StringBuilder strScript = new StringBuilder();
        strScript.Append("var availableTags = ['java','javascript'];");
        strScript.Append("$('#autocomplete').autocomplete(");
        strScript.Append("source: availableTags);");
        Page.ClientScript.RegisterStartupScript(this.GetType(), "Script",
        strScript.ToString(), true);

【问题讨论】:

您使用 MVC 还是 Web 表单? 【参考方案1】:

首先,您需要编写后端代码以从 SQL 获取数据。然后您将使用 JQuery 调用此函数,并且您需要将此值设置为自动完成源。

所以你的自动完成代码应该是这样的。

$("#YourAutoCompleteInputId").autocomplete(
    autoFocus: true, 
    delay: 0,
    scrollIntoView: false,
    source: function (request, response) 
        $.get("/YourControllerName/YourControllerMethod/",  searchTerm: request.term , function (data) 
            response($.map(data, function (item) 
                return 
                    label: item.Name 
                    val: item.Id
                
            ));
        ).fail(function () 
            alert("error");
        );
    ,
    select: function (event, ui) 
        // whatever you return from your back-end code. you can reach here
        // you can reach it by using ui.item.label => it's your label and ui.item.val => is your value. 
        // do something when user select one the result from autocomplete list.
    ,
    open: function () 
        // do something when user open autocomplete list
    ,
    close: function () 
        // do something when user close autocomplete list
    
);

而且你的方法应该是这样的。

public async Task<JsonResult> GetApplicantNamesForAutoComplete(string searchTerm)

    var list = yourData.Where(x => x.yourTableColumnName.Contains(searchTerm))
        .Select(x => new  x.Id, Name = (x.FirstName + " " + x.LastName));
    return Json(await list.ToListAsync(), JsonRequestBehavior.AllowGet);

【讨论】:

以上是关于如何使用 ASP.NET 从 MSSQL 中获取 JQuery 自动完成小部件的数据的主要内容,如果未能解决你的问题,请参考以下文章

如何使用 asp.net 获得 GCM 注册 ID?

如何使用 C# ASP.Net 从 XML 文档中获取特定 XML 元素的列表?

如何使用 c# asp.net 从 url 获取数据?

如何使用 ASP.NET 从 Select 标记中获取数据并插入到 Input 标记中

如何从 ASP.NET 页面获取当前登录的 Windows 帐户?

如何在 c# ASP.NET 中使用 GridView_RowCommand 事件从 GridView 获取图像