Question

我尝试根据学校名称进行搜索，一旦选择了学校名称，就会填写表格。

我在搜索特定的jSON节点时遇到了一些问题，在这种情况下是名称我已经让JSON响应正常工作，但它只是将所有内容返回。不是具体的术语。

我的jSON数据示例：

[
  {
    "name":"The Mendip School",
    "ta":"ta552023",
    "address1":"Longfellow Road",
    "address2":"Radstock",
    "town":"",
    "postcode":"BA3 3AL"
  }
]

我的jQuery如下：

// School Search....
var data_source = 'schools.json';

$(".school_name").autocomplete({
    source: function ( request, response ) {
        $.ajax({
            url: data_source,
            dataType: "json",
            data: {
                term: request.term
            },
            success: function (data) {
                response( $.map( data, function ( item )
                {
                    return {
                        label: item.name,
                        value: item.name
                    };
                }));
            }
        });
    },
    minLength: 3,
    focus: function (event, ui) {
        $(event.target).val(ui.item.label);
        return false;
    },
    select: function (event, ui) {
        $(event.target).val(ui.item.label);
        window.location = ui.item.value;
        return false;
    }
});

如何修改我的JQuery以在名称字段中搜索？我还需要让其他字段填充输入字段。

由于

Answer 1

这可能适合您的需求：

$("#school_name").autocomplete({
    source: function ( request, response ) {
    var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );
    $.getJSON("/schools.json?term=" + request.term, function (data) {

            var x = $.grep(data, function (item, index) {
                    return matcher.test( item.name );
                });
                console.log(x);
            response($.map(x, function (item) {
                    return {
                        label: item.name,
                        value: item.name
                    };
                }));
        });
}

上面的代码将使用正则表达式（new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" )）过滤数据。此正则表达式将搜索带有键入文本（由用户）开始（^）的名称。＆＃39; i＆＃39;在正则表达式中是为了不区分大小写，而escapeRegex将只是转义用户输入中的任何特殊字符。

您也可以使用您的代码并进行相应的更改，我认为它也可以使用。我更喜欢使用$ .getJSON。请注意#school_name的id（在您使用的代码中＆＃39;。＆＃39;）

在此处试试：http://jsbin.com/vawozutepu

jQuery UI自动完成 - 基于json节点进行搜索

1 个答案: