jQuery自动完成UI未完成

时间:2017-01-08 11:14:15

标签: javascript jquery jquery-ui

http://malsup.com/jquery/form/#ajaxForm

Ajax调用自动完成功能已成功进入服务器以获取值并填充到文本框中,并显示错误的UI。

$(function() {
            console.log("ready!");
            $("#stateCode")
                    .autocomplete(
                            {
                                minLength : 1,
                                autoFocus : true,
                                source : function(request, response) {
                                    var jsonstring = "";
                                    $
                                            .ajax({
                                                type : "POST",
                                                url : "masterstate.do?dispatch=getStatesAutocomplete",
                                                data : {
                                                    'statename' : request.term
                                                },
                                                success : function(data) {
                                                    jsonstring = data.trim();
                                                    var name = request.term;
                                                    var data = $
                                                            .grep(
                                                                    JSON
                                                                            .parse(jsonstring),
                                                                    function(e) {
                                                                        return e.state_name
                                                                                .indexOf(name) > -1
                                                                    });
                                                    response(data);
                                                },
                                                error : function() {
                                                    alert("No State names found");
                                                }
                                            });
                                },
                                focus : function(event, ui) {
                                    $("#stateName").val(ui.item.name);
                                    return false;
                                },

                                select : function(event, ui) {
                                    $("#stateName").val(ui.item.state_name);
                                    $("#stateCode").val(ui.item.state_code);
                                    return false;
                                }
                            }).autocomplete("instance")._renderItem = function(
                    ul, item) {
                return $("<li>").append("<a>" + item.state_name + "</a>")
                        .appendTo(ul);
            };
});

0 个答案:

没有答案