根据下拉列表中的值自动完成显示数据

本文关键字：显示 数据 下拉列表 | 更新日期: 2023-09-27 17:53:49

是否有人知道如何，或有任何关于如何过滤在文本框中返回的数据是基于下拉列表中所选项目的值的链接。

。e如果用户从列表中选择酒店，那么当他们开始在文本框中输入与酒店类别匹配的公司地址时，将使用自动完成功能显示。

我已经在下面添加了我的服务器端代码，但是我得到了以下错误:

public JsonResult FilterDirectorySearch(string searchText, string context)
        {
        var wq = DirectoryList(searchText,context).Select(a =>
           new { Location = a.strLocationSearch });
        return Json(wq.Distinct(), JsonRequestBehavior.AllowGet);
        }
    private List<DisplayDirectoryDataForSearchBox> DirectoryList(string searchString, string context)
        {
        var wq = _IGTDD.DisplayDirectoryData()
                  .Where(a => a.strLocationSearch.Contains(searchString, StringComparison.OrdinalIgnoreCase) && a.strCategory = context).ToList();
        return wq.ToList();
        }

错误错误1实例参数:无法从'string'转换为'System.Linq.IQueryable'

错误2 'string'不包含'Contains'的定义和最佳扩展方法重载'System.Linq. queryable .Contains(System.Linq. queryable .Contains(System.Linq. linq . queryable .Contains) 'IQueryable, TSource, System.Collections.Generic.IEqualityComparer)'有一些无效的参数

错误3参数3:无法从"System"转换。StringComparison' to 'System.Collections.Generic。IEqualityComparer '

忘记为

下面的代码添加这个错误
return (from x in wq where x.strLocationSearch.StartsWith(searchString, StringComparison.OrdinalIgnoreCase) && x.strCategory = context select x.strLocationSearch).AsEnumerable();

错误信息:错误1操作符'&&'不能应用于'bool'和'string'类型的操作数

根据下拉列表中的值自动完成显示数据

任何自动完成javascript工具通常都允许您将源配置为函数，可以是javascript函数和本地数据，也可以是AJAX服务器源的函数。

在本地javascript函数或remove AJAX响应器中，您可以通过从所需的下拉框中提取值来简单地添加额外的上下文数据。

处理将在本地javascript代码或远程AJAX响应器中处理额外的信息。

如果没有你使用的自动完成代码的上下文，很难用代码来说明我的答案。

但是，如果您使用jQuery、自动完成UI和AJAX函数作为源代码:

$("#autocompleteTextBox").autocomplete({
    source: function(request, response) {
        var autocompleteContext = $("#dropdownBox").val();
        $.ajax({
            url: "http://source.com/searchJSON",
            dataType: "jsonp",
            data: {
                query: request.term,
                context: autocompleteContext
            },
            success: function(data) {
                ...

注意这两行:

  1. 设置autocompleteContext变量的地方，大概是从你所说的
  2. 其中autocompleteContext通过data参数
    3. 中的searchJSON动作被馈送

服务器端(searchjson的处理程序)[c#/MVC psuedocode]:

public List<string> searchJSON(string query, string context)
{
   return (from x in db.SearchTable where x.Name.Contains(query) && x.context == context select x.Name).ToList()
}

如果你只是在javascript中使用一个本地数组源，改变为一个函数源，类似于AJAX源…

var fullArray = ["Apple", "Bat", "Cat", "Dog"];
$("#autocompleteTextBox").autocomplete({
    source: function(request, response) {
        var autocompleteContext = $("#dropdownBox").val();
        response = //Code to filter fullArray with request.term and autocompleteContext here
    }

这是一个功能完整的客户端示例:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="http://code.jquery.com/jquery-1.8.3.js" type="text/javascript"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js" type="text/javascript"></script>
    <link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css" />
    <script type="text/javascript">
        if (!Array.prototype.filter) {
            Array.prototype.filter = function (fun /*, thisp */) {
                "use strict";
                if (this == null)
                    throw new TypeError();
                var t = Object(this);
                var len = t.length >>> 0;
                if (typeof fun != "function")
                    throw new TypeError();
                var res = [];
                var thisp = arguments[1];
                for (var i = 0; i < len; i++) {
                    if (i in t) {
                        var val = t[i]; // in case fun mutates this
                        if (fun.call(thisp, val, i, t))
                            res.push(val);
                    }
                }
                return res;
            };
        }
        $(function () {
            var availableAddresses = [
                "New York Hotel",
                "London Restaurant",
                "London Hotel",
                "Paris Restaurant",
                "Berlin Restaurant",
                "Moscow Restaurant"
            ];
            $("#businesses").keyup(function () {
                $("#businesses").autocomplete({
                    source: availableAddresses.filter(function (element, index, array) {
                        return (element.toLowerCase()
                            .indexOf($("#filter").val().toLowerCase()) !== -1);
                    })
                });
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <select id="filter">
                <option>hotel</option>
                <option>restaurant</option>
            </select>
            <input type="text" id="businesses"/>
        </div>
    </form>
</body>
</html>
相关文章：