首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >使用Ajax、Jquery、Asp.Net MVC从db获取数据并以表格格式显示。

使用Ajax、Jquery、Asp.Net MVC从db获取数据并以表格格式显示。
EN

Stack Overflow用户
提问于 2016-12-20 19:33:47
回答 2查看 11K关注 0票数 0

我已经建立了到数据库的连接,我想在视图中以表格格式显示数据库中的所有细节,但我无法做到这一点,因为我的新可以任何人帮助。

 public class EmployeeModel
 {
    public int EmpId { get; set; }

    public string EmpName { get; set; }

    public int Age { get; set; }

    public int Salary { get; set; }

 }

控制器:

 private static readonly string connectionString =    ConfigurationManager.ConnectionStrings["ConnStringDb1"].ConnectionString;
    public ActionResult GetUser()
    {
        return View();
    }

    public JsonResult GetAllUser(int EmpId)
    {
        List<EmployeeModel> employee = new List<EmployeeModel>();
        string query = string.Format("Select * From Employee", EmpId);
        SqlConnection connection = new SqlConnection(connectionString);
        {
            using (SqlCommand cmd = new SqlCommand(query, connection))
            {
                connection.Open();
                SqlDataReader reader = cmd.ExecuteReader();

                while (reader.Read())
                {
                    employee.Add(
                        new EmployeeModel
                        {
                            EmpId = int.Parse(reader["EmpId"].ToString()),
                            EmpName = reader.GetValue(0).ToString(),
                            Age = int.Parse(reader["Age"].ToString()),
                            Salary = int.Parse(reader["Salary"].ToString())
                        }
                    );
                }
            }
            return Json(employee, JsonRequestBehavior.AllowGet);
        }
    }

查看:

   @{
    ViewBag.Title = "Home Page";
    var EmployeeModel = (List<second_day.Models.EmployeeModel>)Model;
}
<button>Click me</button>

<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $(':button').click(function () {
            GetEmployeeUsingAjax();
        });
    });

    function GetEmployeeUsingAjax() {
        var EmpId = 2;
        $.ajax({
            type: 'GET',
            url: '@Url.Action("GetAllUser")',
            data: { "EmpId": EmpId},
            dataType: 'json',
            success: function (data) {
                $.each(data, function (i, item) {
                    var rows = "<tr>"
                    + "<td>" + item.EmpID + "</td>"
                    + "<td>" + item.EmpName + "</td>"
                    + "<td>" + item.Age + "</td>"
                    + "<td>" + item.Salary + "</td>"
                    + "</tr>";
                    $('#tblProducts tbody').append(rows);
                });
            },
            error: function (emp) {
                alert('error');
            }
        });
    }
</script>
<table class="tblProducts">
    <thead>
        <tr class="headings" style="background-color:#4495d1;">
            <th>EmpId</th>
            <th>EmpName</th>
            <th>Age</th>
            <th>Salary</th>
         </tr>
</thead>
    <tbody >
    </tbody>
</table>

有人能给我提个解决方案吗?

在控制台中获取数据,但不以表格形式显示

EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/41241389

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档