ASP.NET MVC and jqGrid 学习笔记 3-如何从数据库获得数据

实际应用中,大部分都是从数据库里获得数据,所以先建立一个数据库,Database first 或者Code first都可以,这里用Code first。

一、Model

   public class Member
    {
        [Key]
        public int No { get; set; }

        [Required]
        [MaxLength(5)]
        public string Name { get; set; }

        [MaxLength(200)]
        public string Email { get; set; }

        [DatabaseGenerated(DatabaseGeneratedOption.Computed)]
        public DateTime? CreatedOn { get; set; }
    }

再创建一个数据上下文类:

using System.Data.Entity;

namespace HelloJqGrid.Models
{
    public class MyContext:DbContext
    {
        public MyContext():base("name=DefaultConnection"){}

        public DbSet<Guestbook> Guestbooks { get; set; }
        public DbSet<Member> Members { get; set; }
    }
}

好了!按理说就是这样就算Model建好了。但是我们的数据库在哪里呢?摸索后发现,还必须得把它“激活”才能看得到。怎么激活?用刚创建的2个类来自动生成CRUD,然后添加一些数据,保存后,在App_Data文件夹里就看到了(点击显示所有文件,刷新)。

生成CRUD的过程:

新建一个Controller

就是刚才创建的2个类。

点击添加按钮后就自动生成了CRUD的页面。

书归正传。

二、View

@{
    ViewBag.Title = "ShowServerData";
}

<h2>ShowServerData</h2>
<script type="text/javascript">
    $(function () {
        jQuery("#grid").jqGrid({
            url: "/Home/GetServerData",
            datatype: "json",           
            mtype:"get",
            //colNames: ['No', 'Name', 'Client'],
            colModel: [
                {label:'Number', name: 'No', index: 'No', width: 60, sorttype: "int" },
                {label:'Name', name: 'Name', index: 'Name', width: 90 },
                {label:'Email', name: 'Email', index: 'Email', width: 100 },
                {label:'Created On', name: 'CreatedOn', index: 'CreatedOn', width: 100 }
            ],
            caption: "jqGrid data",
            rowNum: 5,
            pager: "pager",
            viewrecords: true,
            width: 500, height: "auto",
            jsonReader:{repeatitems: false}
        });
    });
</script>

<table id="grid"></table>
<div id="pager"></div>

 

三、Controller

在Controller中写2个action,一个是显示页面的,一个是从数据库获得数据的。

     public ActionResult ShowServerData()
        {
            return View();
        }
        public ActionResult GetServerData(int? page, int? rows,string sidx,string sord)
        {
            HelloJqGrid.Models.MyContext db = new Models.MyContext();
            var query = db.Members.ToList();

            //jqgrid的参数
            int pageNum = page.HasValue ? page.Value : 1;//当前显示哪一页
            int pageSize = rows.HasValue ? rows.Value : 10;  //每一页显示多少条记录
            int totalRecords = query.Count();//总记录数
            int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);//总页数
            var jsonData = new
            {
                total = totalPages,
                page = pageNum,
                records = totalRecords,
                rows = query.Skip((pageNum - 1) * pageSize).Take(pageSize)//分页
            };

            return Json(jsonData, JsonRequestBehavior.AllowGet);
        }

其实和从本地获得数据代码差不多,只是用:

 HelloJqGrid.Models.MyContext db = new Models.MyContext();
 var query = db.Members.ToList();

来作为rows的数据。

完了。

完了!对,Run 一下就显示数据了,但是!这个不能排序!

说到排序,好像就一下子牵涉到了很多的东西,什么动态linq,表达式树等等。居然很复杂!下回再说。

posted @ 2013-12-18 20:41  ibg  阅读(494)  评论(0编辑  收藏  举报