javascript - jQuery Autocomplete mustmatch doesn't have any effect - Stack Overflow

admin管理员组

文章数量:1317898

I'm using jQuery 1.4.4 and jQuery UI 1.8.9. I have an autoplete field that works really well, however I'd like to contrain the input to only what the autoplete backend es up with.

The documetation states:

mustMatch Boolean Default: false

If set to true, the autopleter will only allow results that are presented by the backend. Note that illegal values result in an empty input box.

However, when I set mustMatch to true, it doesn't make any difference - I can still type in anything I like and nothing happens.

I'm fairly sure this is something I'm doing and not a bug as I haven't seen anything on google that points to that.

Here's a code snippet:

    $( ".client" ).autoplete({
    minLength: 2,
    mustMatch: true,
    source: function( request, response ) {
        var term = request.term;
        if ( term in client_cache ) {
            response( client_cache[ term ] );
            return;
        }

        client_lastXhr = $.getJSON( "amex/start.php?action=autoplete&field=client", request, function( data, status, xhr ) {
            client_cache[ term ] = data;
            if ( xhr === client_lastXhr ) {
                response( data );
            }
        });
    }
});

Can anyone see what I'm doing wrong? Thanks for your help!

I'm using jQuery 1.4.4 and jQuery UI 1.8.9. I have an autoplete field that works really well, however I'd like to contrain the input to only what the autoplete backend es up with.

The documetation states:

mustMatch Boolean Default: false

If set to true, the autopleter will only allow results that are presented by the backend. Note that illegal values result in an empty input box.

However, when I set mustMatch to true, it doesn't make any difference - I can still type in anything I like and nothing happens.

I'm fairly sure this is something I'm doing and not a bug as I haven't seen anything on google that points to that.

Here's a code snippet:

    $( ".client" ).autoplete({
    minLength: 2,
    mustMatch: true,
    source: function( request, response ) {
        var term = request.term;
        if ( term in client_cache ) {
            response( client_cache[ term ] );
            return;
        }

        client_lastXhr = $.getJSON( "amex/start.php?action=autoplete&field=client", request, function( data, status, xhr ) {
            client_cache[ term ] = data;
            if ( xhr === client_lastXhr ) {
                response( data );
            }
        });
    }
});

Can anyone see what I'm doing wrong? Thanks for your help!

• javascript
• jquery
• autoplete
• jquery-ui-autoplete

Share Improve this question Follow edited Sep 23, 2011 at 17:39 Andrew Whitaker 126k3232 gold badges295295 silver badges308308 bronze badges asked Mar 14, 2011 at 22:17 John HuntJohn Hunt 4,08299 gold badges4646 silver badges6161 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 6

You probably found this option on the documentation page for the deprecated plugin. jQueryUI's current documentation is located here.

It looks like they removed the mustMatch option, but according to this StackOverflow question, you can implement it yourself.

For those in need of plete and much simpler solution, try this...

$("#my_autoplete").autoplete({
    source: "my_data.php",
    change: function(e, ui) {
        if (!ui.item) {
            $(this).val("");
        }
    },
    response: function(e, ui) {
        if (ui.content.length == 0) {
            $(this).val("");
        }
    }
}).on("keydown", function(e) {
    if (e.keyCode == 27) {
        $(this).val("");
    }
});

JSFiddle example: http://jsfiddle/dfc83/

If you want to clear, only to return a value judgment json data inside a wood there, you can then empty it.

如果想要清空，只需要判断返回的json里面的某值有木有数据，然后清空就可以啦。

function selectRegion(){
$("#saleRegionSelect").autoplete({
    source: function (request, response) {
        var cityId=$("[name='city']").val();
        var oppType=$("[name='primaryBiz']:checked").val();
        var site= $.trim($("#channel").val());
        if(oppType==undefined){
            return false;
        }
        if(site==undefined){
            return false;
        }
        $.ajax({
            url: rootPath + "ajax/regionByCityAndSite",
            dataType: "json",
            type: "post",
            data: {
                region: request.term,
                city:cityId,
                site:site,
                oppType:oppType
            },
            success: function (data) {
                if (!data.rows) { //Look at this line

                    $('#saleRegionSelect').val('');//clear
                    $('#saleRegion').val(''); //clear

                    response(($.map([], function (item) {
                        return {}
                    })));
                } else {
                    response(($.map(data.rows, function (item) {
                        return {
                            label: item.region + ($.trim(item.saleName)==""?"":' (' + item.saleName + ')'),
                            value: item.region + ($.trim(item.saleName)==""?"":' (' + item.saleName + ')'),
                            id: item.id
                        }
                    })));
                }
            }
        })
    },
    minLength: 1, 
    select: function (event, ui) {
        $("#saleRegion").val(ui.item.id);
    }
});

}

=> json :

{
"status": 200,
"message": "查询数据成功！",
"rows": [{
    "id": "678140138089353216",
    "oppType": 10,
    "saleId": "201402201431456839e855",
    "saleName": "陈",
    "creator": "zhangdanling",
    "createTime": "2015-12-19 17:26:29",
    "modifier": "zhangdanling",
    "modifyTime": "2015-12-22 11:11:35",
    "cityId": 147,
    "site": 1,
    "region": "测试测试",
    "remark": ""
}, {
    "id": "678847511099609088",
    "oppType": 10,
    "saleId": "201402201431456839e855",
    "saleName": "陈",
    "creator": "zhangdanling",
    "createTime": "2015-12-21 16:17:23",
    "modifier": "zhangdanling",
    "modifyTime": "2015-12-22 15:55:59",
    "cityId": 147,
    "site": 1,
    "region": "测试一区",
    "remark": ""
}, {
    "id": "678910954649423872",
    "oppType": 10,
    "saleId": "201402201431456839e855",
    "saleName": "陈",
    "creator": "zhangdanling",
    "createTime": "2015-12-21 20:29:30",
    "modifier": "zhangdanling",
    "modifyTime": "2015-12-21 20:29:30",
    "cityId": 147,
    "site": 1,
    "region": "测试区域三",
    "remark": ""
}, {
    "id": "679596181579374592",
    "oppType": 10,
    "saleId": "201407081036237ccfe9dc",
    "saleName": "张",
    "creator": "zhangdanling",
    "createTime": "2015-12-23 17:49:05",
    "modifier": "zhangdanling",
    "modifyTime": "2015-12-23 17:49:14",
    "cityId": 147,
    "site": 1,
    "region": "测试一下",
    "remark": ""
}, {
    "id": "680322348053700608",
    "oppType": 10,
    "saleId": "201407081036237ccfe9dc",
    "saleName": "张",
    "creator": "SYS_INIT",
    "createTime": "2015-12-25 17:54:20",
    "modifier": "SYS_INIT",
    "modifyTime": "2015-12-25 17:54:20",
    "cityId": 147,
    "site": 1,
    "region": "测试一下001",
    "remark": ""
}, {
    "id": "681308156487278592",
    "oppType": 10,
    "saleId": "201402201431456839e855",
    "saleName": "陈",
    "creator": "zhangdanling",
    "createTime": "2015-12-28 11:11:56",
    "modifier": "zhangdanling",
    "modifyTime": "2015-12-28 11:11:56",
    "cityId": 147,
    "site": 1,
    "region": "测试离职销售区域",
    "remark": ""
}]

}

本文标签： javascriptjQuery Autocomplete mustmatch doesn39t have any effectStack Overflow