2013年12月22日 星期日

Asp.net jQuery+DropDownList連動後出現System.Web.HttpUnhandledException

這其實只是不了解jquery及asp.net postback的問題
有兩個DropDownList,Master及Detail
下拉Master連動Detail一般來寫程式碼都會如下
 $(function () {
    $("#<%= Master.ClientID%>").change(function () {
            var q = $("#<%= Master.ClientID%>").val();
                $.ajax({
                    url: '/get.ashx',
                    type: 'post',
                    async: true,
                    data: { q: q },
                    success: function (data) {
                        $('#<%= Detail.ClientID%>').empty();
                        var myarray = $.parseJSON(data);
                        $.each(myarray, function (i, item) {
                            var option = "";
                            $('#<%= Detail.ClientID%>').append(option);
                        });
                    }
                });
            });
  });
上面程式碼看似無誤,但在PostBack後就會出現System.Web.HttpUnhandledException
因為PostBack後會產生畫面
放在$(function (){});裡面又會跑一次但程式而此時就會造成錯誤
所以必需將select change放於jquery function外
 $(function () {
    
  });

$("#<%= Master.ClientID%>").change(function () {
            var q = $("#<%= Master.ClientID%>").val();
                $.ajax({
                    url: '/get.ashx',
                    type: 'post',
                    async: true,
                    data: { q: q },
                    success: function (data) {
                        $('#<%= Detail.ClientID%>').empty();
                        var myarray = $.parseJSON(data);
                        $.each(myarray, function (i, item) {
                            var option = "";
                            $('#<%= Detail.ClientID%>').append(option);
                        });
                    }
                });
            });