Question

我需要通过JSON / Ajax填充网格（我不想使用模板）...其余的代码工作正常

编辑：是否需要使用DataSource / DataBind绑定网格？没有它可以做到吗？

这是我的成功函数（代码是根据教程）

 $.ajax({
    type: "POST",
    url: location.pathname + "/getData",
    data: "{}",
    contentType: "application/json;charset=utf-8",
    dataType: "JSON",
    async: "true",
    success: function(data) {
      for (var i = 0; i < data.d.length; i++) {
             $("#gvDetails").append("<tr><td>" + data.d[i].Id + "</td><td>" + data.d[i].FUllName + "</td></tr>");
       }
     },
    error: function (response) {
        alert(response.status + ' ' + response.statusText);
    }

});

json数据：

0   Object { Id=1, FUllName="John Smith", Gender="Male", more...}    
1   Object { Id=29, FUllName="aass", Gender="ss", more...}

网格标记：

<asp:GridView ID="gvDetails" runat="server">

它没有显示任何内容。

类似的帖子：

Populating Gridview Using Ajax

这篇帖子要求在Grid上追加。我做到了.. 请建议

Answer 1

试试这个。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
   $(document).ready(function() {
    $.ajax({
          type: "POST",
          contentType: "application/json; charset=utf-8",
          url: "Default.aspx/BindDatatable",
          data: "{}",
          dataType: "json",
          success: function(data) {
          for (var i = 0; i < data.d.length; i++) {
                 $("#gvDetails").append("<tr><td>" + data.d[i].UserId + "</td><td>" + data.d[i].UserName + "</td><td>" + data.d[i].Location + "</td></tr>");
           }
         },
        error: function(result) {
              alert("Error");
      }
    });
  });
  </script>

<asp:GridView ID="gvDetails" runat="server">
     <HeaderStyle BackColor="#DC5807" Font-Bold="true" ForeColor="White" />
</asp:GridView>

Answer 2

我最后通过引用其他帖子来使其工作..但我不认为这是好代码::

ajax方法：

 $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: "WebForm1.aspx/GetDBData",
        data: "{}",
        dataType: "json",
        success: function (data) {
            $("#gvDetails").find("tr:gt(0)").remove();
            for (var i = 0; i < data.d.length; i++) {
                $("#gvDetails").append("<tr><td>" + data.d[i].Id + "</td><td>" + data.d[i].Gender + "</td></tr>");
            }

        },
        error: function (result) {
            alert(result.status + ' ' + result.statusText);
        }
    });

方法背后的代码......

    static DataTable dt = new DataTable();

    protected void Page_Load(object sender, EventArgs e)
    {
        dt = LoadData();
        gvDetails.DataSource = dt;
        gvDetails.DataBind();
    }


    [WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static Employee[] GetDBData()
    {
        dt = LoadData();
        List<Employee> details = new List<Employee>();
        foreach (DataRow dtrow in dt.Rows)
        {
            try
            {
                Employee user = new Employee();
                user.Id = Convert.ToInt32(dtrow["Id"]);
                user.Gender = dtrow["Gender"].ToString();
                details.Add(user);
            }

            catch (Exception e)
            {
                throw e;
            }
        }

        return details.ToArray();
    }

从数据库加载数据..

   public static DataTable LoadData()
        {
            dt.Rows.Clear();
            String ConnString = ConfigurationManager.ConnectionStrings["ComputerFirmConnectionString"].ConnectionString;
            SqlDataAdapter adapter = new SqlDataAdapter();
            DataTable myDataTable = new DataTable();
            using (SqlConnection conn = new SqlConnection(ConnString))
            {
                adapter.SelectCommand = new SqlCommand("SELECT Id, Gender FROM tblEmployee", conn);
                adapter.Fill(myDataTable);
            }
            return myDataTable;

        }

Asp.net Grid不使用JSON / AJAX填充

2 个答案: