javascript - jQuery 自动完成集成

Question

我找到了这个 jQuery，我想将它集成到我的元素中。我的问题是如何应用该“来源”？

因为在我的输入中，我收到了所有来自数据库的信息，而且我之前不能在 html 或 jQuery 中写任何东西!

实际上我使用 wicket 组件来自动完成，但该组件有问题，因为如果我调整浏览器的大小，列表不会在输入下方对齐，因此我正在尝试找到更好的方法。

如果有人可以帮助我:)

var $element = $('.my-autocomplete');
var $testinput = $element.find('.my-autocomplete-input');

$testinput.autocomplete({
    minLength: 0,
    autoFocus: true,
    source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"]
  });

fiddle 示例: http://jsfiddle.net/CSypd/36/

谢谢!

Answer 1

客户端

    $("#element _id").autocomplete({
                source: function (request, response) {
                    $.ajax({
                        url: '@Url.Action("GetEmployeeDepartmentStuff")',  
                        //generates into a url. eg http://www.site.com/MyPage/GetEmployeeDepartmentStuff?filter=....
                        dataType: "json",
                        data: {
                            filter: request.term
                        },
                        success: function (data) {
                            response($.map(eval(data), function (item) {
                                return {
                                    label: item.em_name,
                                    dp_Name: item.dp_Name
                                }
                            }));
                        }
                    })
                },
                maxLength: 2,
                select: function (event, ui) {                   
                    $("#Deparment").attr('value', ui.item.dp_Name);
                }
            });

服务器端

    [HttpGet]
    [CompressFilter]
    public ActionResult GetEmployeeDepartmentStuff(string filter = "")
    {
        SomeRepository repo = new SomeRepository();
        return repo.GetEmployeeDepartmentStuff(filter);   //returns a JSON result
    }

不知道你的服务器端代码使用什么语言，但你需要有一个 web 方法/服务/接受参数“filter”(见上文)或任何你想发送的东西返回....也不要忘记在您的标记中包含 jquery 库