Question

我正在创建一个搜索所有客户详细信息的页面... 我也使用json自动完成文本框和数据表的数据...

<script type="text/javascript">
$(document).ready(function () {
    $("#<%=txtSearch.ClientID %>").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: '<%=ResolveUrl("~/Service.asmx/GetCustomers") %>',
                data: "{ 'prefix': '" + request.term + "'}",
                dataType: "json",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                success: function (data) {
                    response($.map(data.d, function (item) {
                        return {
                            label: item.split('-')[0],
                            val: item.split('-')[1]
                        }
                    }))
                },
                error: function (response) {
                    alert(response.responseText);
                },
                failure: function (response) {
                    alert(response.responseText);
                }
            });
        },
        select: function (e, i) {
            $("#<%=hfCustomerId.ClientID %>").val(i.item.val);
        },
        minLength: 1
    });

});

我想在textchanged事件的文本框中查看所选名称的数据，他们的textbgox设置看起来像..`

 <asp:TextBox ID="txtSearch" runat="server" AutoPostBack="True" 
        ontextchanged="txtSearch_TextChanged"></asp:TextBox>

该textchenged事件在mozilla中正确触发，但在chrome中没有工作，任何人都可以提出一些解决方案......

Answer 1

我建议在从自动完成列表中选择一个值后调用服务器端的文本框onchange事件，

...
select: function (e, i) {
        $("#<%=hfCustomerId.ClientID %>").val(i.item.val);
        __doPostBack("txtSearch", "TextChanged");
    },
    minLength: 1
});

并删除该文本框的autopostback属性，因为我们从客户端触发它。

或者您可以对select事件进行ajax调用，并在客户端本身填充所需的数据。

Answer 2

`  $(document).ready(function () {
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_initializeRequest(InitializeRequest);
        prm.add_endRequest(EndRequest);           
        InitAutoCompl();
    });

    function InitializeRequest(sender, args) {
    }

    function EndRequest(sender, args) {           
        InitAutoCompl();
    }

    function InitAutoCompl() {
        $("#<%=txtSearch.ClientID %>").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: ''<%=ResolveUrl("~/Service.asmx/GetCustomers") %>',
                    data: "{ 'prefix': '" + request.term + "'}",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        response($.map(data.d, function (item) {
                            return {
                                label: item.split('@@')[0],
                                val: item.split('@@')[1]
                            }
                        }))
                    },
                    error: function (response) {
                        alert(response.responseText);
                    },
                    failure: function (response) {
                        alert(response.responseText);
                    }
                });
            },

            minLength: 1, change: function (event, ui) { __doPostBack("txtSearch", "TextChanged"); }
        });
    }

并删除Autopostback =＆＃34; true＆＃34;来自TextBox
`

文本框中的Textchanged事件未在chrome

2 个答案: