如何在AJAX JSON数据中使用jQuery自动完成组合框？

Question

我需要使用组合框来执行以下操作.

• Select box 有一个用户可以搜索的默认城市列表.
• 如果用户在input框中键入文本,我需要进行ajax调用以获取数据并向用户显示选项.
• 如果为用户的请求提取了数据,则应将这些城市附加到选项中 Select box

使用jQuery自动完成我能够在用户输入字符串并显示结果时获取json数据.但是,我对如何使用组合框集成它非常无能为力.

Combobox使用静态数据数组进行搜索,如果我理解正确,则使用正则表达式匹配值.但是,如何中断它并使用ajax调用从服务器获取数据并更新结果？

输入文本框的自动填充:

$( "#searchDestination" ).autocomplete({
        delay: 500,
        source: function( request, response ) {
            $.ajax({
                url: "/wah/destinationsJson.action",
                dataType: "json",
                data: {
                    term: request.term
                },
                type: "POST",
                success: function(data){
                    if(data.cities.length == 0)
                        return response(["No matching cities found for " + request.term]);
                    response( $.map(data.cities, function(item){
                        return{
                            label: item.name,
                            value: item.name
                        };
                    })
                    );
                }
            });
        },
        minLength: 2

    });
    });

Answer 1

这可能会帮助你..我使用的另一个自动完成插件。

另请阅读此内容

如果您想在文本字段中动态加载数据，请使用上面的插件。否则，如果您想使用组合框，则只需在ready（）上加载数据并使用jquery自动完成插件即可！