通过ajax调用使用web方法绑定下拉列表

时间:2016-07-18 11:09:21

标签: c# jquery asp.net

我的Ajax电话:

 jQuery(document).ready(function () {
        $("#ddl").change(function () {
            var id = $(this).find(":selected").val()
          $.ajax({
             type: "POST",
             url : "HazzardsDashBoards.aspx/GetReport1",
            data: "JSON.stringify(id)",                
            contentType: 'application/json',
            dataType: 'json',
                complete: function (data) {

                    var data = JSON.stringify(data);

                },
                error :function()
                {
                  alert("error");
                }
            });
        });
    });

我的网络方法:         [网络方法]

  public static List<Dictionary<string, object>> GetReport1(string id)
            {
                List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>();             

                    string strQry = string.Empty;

                    strQry = " select YEAR(mwl.dt_ModifiedOn)[date],COUNT(*) [HazardCount] from tbl ";
                    strQry += " left outer join TRANS_HAZARD_HAZARD_DETAILS thzd on thzd.int_HAZARD_ID = mwl.str_ObjectID";
                    strQry += " where int_PluginID = 4 and int_FeatureID=35 ";
                    if (id != "")
                    {
                        if (id == "1")
                        {
                            strQry += " and  col= 'E'";
                        }
                        else
                        {
                            strQry += " and  col= 'C'";
                        }
                    }                     

                    strQry += " group by year(mwl.dt_ModifiedOn) ";

                    using (commonManager)
                    {
                        DataTable dt = commonManager.ExecuteDataTable(strQry);

                        Dictionary<string, object> row;
                        foreach (DataRow dr in dt.Rows)
                        {
                            row = new Dictionary<string, object>();
                            foreach (DataColumn col in dt.Columns)
                            {
                                row.Add(col.ColumnName, dr[col]);
                            }
                            rows.Add(row);
                        }
                    }                   
                return rows;
            }

我是Ajax Call的新手,我将下拉选择的值发送到我的webmethod。选择下拉列表后,我的图表不会渲染..在选择下拉列表后,我的图表也不会渲染。 它显示错误提示。

2 个答案:

答案 0 :(得分:0)

更改此内容 - &gt; data: "JSON.stringify(id)"data : JSON.stringify({"clientID":id})

您需要发送JSON字符串。

答案 1 :(得分:-1)

     @ADyson
    I modified ajax call as you 
suggested then also i  am getting the problem.

            jQuery(document).ready(function () {
            $("#ddl").change(function () {
                var id = $(this).find(":selected").val()
                var clientID = { "clientID" : id }

              $.ajax({
                 type: "POST",
                 url : "HazzardsDashBoards.aspx/GetReport1",
                data: JSON.stringify(clientID),                
                contentType: 'application/json',
                dataType: 'json',
                    complete: function (data) {


                        var data = JSON.stringify(data);
                        alert(JSON.stringify(data));
                    },
                    error :function()
                    {
                      alert("An error occurred whilst trying to contact the server: " + jQXHR.status + " " + textStatus + " " + errorThrown);
                    }
                });
            });
        });