数据不会显示在表格中

时间:2015-10-16 03:33:56

标签: c# jquery asp.net api

我是JQuery和API的新手,在这里我试图以JSON格式从SQL检索数据,然后将其绑定到表。我在调试时在此处返回数据return details.ToString();,但它没有将数据绑定到表中。这里有错误吗?

控制器:

public class EmployeeController : ApiController
{
    static EmpRepository repository = new EmpRepository();

    public string GetData(Employee Em) {
        var re = repository.GetData(Em);
        return re;
    }

}

存储库类:

public  string GetData(Employee Em)
{
    DataTable dt = new DataTable();
    List<Employee> details = new List<Employee>();

    connection();
    com = new SqlCommand("select FirstName, LastName, Company from Employee", con);
    con.Open();
    SqlDataAdapter da = new SqlDataAdapter(com);
    da.Fill(dt);
    foreach (DataRow dr in dt.Rows)
    {
        Employee user = new Employee();
        //user.Id = Int32.Parse(string dr["Id"]);
        user.FirstName = dr["FirstName"].ToString();
        user.LastName = dr["LastName"].ToString();
        user.Company = dr["Company"].ToString();
        details.Add(user);
    }
    return details.ToString();
}

JQuery的:

$(document).ready(function DisplayResult() {
    var Emp = {};
    var url = 'api/Employee/GetData';
    $.ajax({

        type: "POST",
        url: url,
        contentType: "application/json;charset=utf-8",
        //data: {},
        dataType: "json",
        success: function (data) {

            for (var i = 0; i < data.d.length; i++)
            {
                $("#tbDetails").appendTo("<tr><td>" + data.d[i].FirstName + "</td><td>" + data.d[i].LastName + "</td><td>" + data.d[i].Company + "</td></tr>");
            }
        },

        error: function (result) {

            alert("error");
        }
    });

});

2 个答案:

答案 0 :(得分:0)

我认为你的代码中有两个错误。

  • On&#34; public string GetData(Employee Em)&#34; 我想你要返回员工列表 所以应该更改return details.ToString(); to 返回详细信息; `

将是

public  List<Employee> GetData(Employee Em)
{
    DataTable dt = new DataTable();
    List<Employee> details = new List<Employee>();

   connection();
    com = new SqlCommand("select FirstName, LastName, Company from Employee", con);
            con.Open();
            SqlDataAdapter da = new SqlDataAdapter(com);
            da.Fill(dt);
            foreach (DataRow dr in dt.Rows)
            {
                Employee user = new Employee();
               // user.Id = Int32.Parse(string dr["Id"]);
                user.FirstName = dr["FirstName"].ToString();
                user.LastName = dr["LastName"].ToString();
                user.Company = dr["Company"].ToString();
                details.Add(user);


            }
            return details; }

-Change GetData api,必须返回 JSON格式。它将如下所示

 public string GetData(Employee Em) {
    var re = repository.GetData(Em);
    return Json(re);}

for (var i = 0; i < data.d.length; i++)
    {
        $("#tbDetails").appendTo("<tr><td>" + data.d[i].FirstName + "</td><td>" + data.d[i].LastName + "</td><td>" + data.d[i].Company + "</td></tr>");
    }

更改为

for (var i = 0; i < data.length; i++)
    {
        $("#tbDetails").appendTo("<tr><td>" + data[i].FirstName + "</td><td>" + data[i].LastName + "</td><td>" + data[i].Company + "</td></tr>");
    }
祝你好运!

答案 1 :(得分:0)

以下是您执行每个部分所需的更改。

首先在您的Repository中返回详细信息,而不是detail.ToString()

接下来在您的存储库类和WebApi控制器中,您不需要在任何地方都不使用Employee参数。删除它。

存储库类 - &gt;

public  string GetData()
    {
        DataTable dt = new DataTable();
        List<Employee> details = new List<Employee>();

       connection();
        com = new SqlCommand("select FirstName, LastName, Company from Employee", con);
                con.Open();
                SqlDataAdapter da = new SqlDataAdapter(com);
                da.Fill(dt);
                foreach (DataRow dr in dt.Rows)
                {
                    Employee user = new Employee();
                   // user.Id = Int32.Parse(string dr["Id"]);
                    user.FirstName = dr["FirstName"].ToString();
                    user.LastName = dr["LastName"].ToString();
                    user.Company = dr["Company"].ToString();
                    details.Add(user);


                }
                return details;

            }

WebApi控制器:

您不需要在此处将任何内容转换为JSON,默认情况下,JSON.NET序列化程序会将您的List转换为JSON员工对象数组。

public class EmployeeController : ApiController
    {
        static EmpRepository repository = new EmpRepository();

        public string GetData() {
            var re = repository.GetData();
            return re;
        }

    }

现在在你的jquery:

理想情况下,你在这里做'GET'而不是POST,现在返回的数据就是一系列员工对象迭代它。

 $(document).ready(function DisplayResult() {
    var Emp = {};
    var url = 'api/Employee/GetData';
    $.ajax({

        type: "GET",
        url: url,
        contentType: "application/json;charset=utf-8",
        success: function (data) {

            for (var i = 0; i < data.length; i++)
            {
                $("#tbDetails").appendTo("<tr><td>" + data[i].FirstName + "</td><td>" + data[i].LastName + "</td><td>" + data[i].Company + "</td></tr>");
            }
        },

        error: function (result) {

            alert("error");
        }
    });

});