MongoDB学习笔记(三) 在MVC模式下通过Jqgrid表格操作MongoDB数据

zzl001

　　看到下图，是通过Jqgrid实现表格数据的基本增删查改的操作。表格数据增删改是一般企业应用系统开发的常见功能，不过不同的是这个表格数据来源是非关系型的数据库MongoDB。nosql虽然概念新颖，但是MongoDB基本应用实现起来还是比较轻松的，甚至代码比基本的ADO.net访问关系数据源还要简洁。由于其本身的“非关系”的数据存储方式，使得对象关系映射这个环节对于MongoDB来讲显得毫无意义，因此我们也不会对MongoDB引入所谓的“ORM”框架。

　　下面我们将逐步讲解怎么在MVC模式下将MongoDB数据读取，并展示在前台Jqgrid表格上。这个“简易系统”的基本设计思想是这样的：我们在视图层展示表格，Jqgrid相关Js逻辑全部放在一个Js文件中，控制层实现了“增删查改”四个业务，MongoDB的基本数据访问放在了模型层实现。下面我们一步步实现。
一、实现视图层Jqgrid表格逻辑
　　首先，我们新建一个MVC空白项目，添加好jQuery、jQueryUI、Jqgrid的前端框架代码：
　　然后在Views的Home文件夹下新建视图“Index.aspx”，在视图的body标签中添加如下HTML代码：
?     　　接着新建Scripts\Home文件夹，在该目录新建“Index.js”文件，并再视图中引用，代码如下：
View Code?123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119jQuery(document).ready(function() { //jqGrid初始化 jQuery("#table1").jqGrid({ url: '/Home/UserList', datatype: 'json', mtype: 'POST', colNames: ['登录名', '姓名', '年龄', '手机号', '邮箱地址', '操作'], colModel: [ { name: 'UserId', index: 'UserId',>true}, { name: 'UserName', index: 'UserName',>true}, { name: 'Age', index: 'Age',>true}, { name: 'Tel', index: 'Tel',>true}, { name: 'Email', index: 'Email',>true}, { name: 'Edit', index: 'Edit',>false, align: 'center'} ], pager: '#div1', postData: {}, rowNum: 5, rowList: [5, 10, 20], sortable: true, caption: '用户信息管理', hidegrid: false, rownumbers: true, viewrecords: true}).navGrid('#div1', { edit: false, add: false, del: false}) .navButtonAdd('#div1', { caption: "编辑", buttonicon: "ui-icon-add", onClickButton: function() { varid = $("#table1").getGridParam("selrow"); if(id == null) { alert("请选择行！"); return; } if(id == "newId") return; $("#table1").editRow(id); $("#table1").find("#"+>"_UserId").attr("readonly","readOnly"); $("#table1").setCell(id, "Edit", "+>"\")' />+>"\")' />"); } }).navButtonAdd('#div1', { caption: "删除", buttonicon: "ui-icon-del", onClickButton: function() { varid = $("#table1").getGridParam("selrow"); if(id == null) { alert("请选择行！"); return; } Delete(id); } }).navButtonAdd('#div1', { caption: "新增", buttonicon: "ui-icon-add", onClickButton: function() { $("#table1").addRowData("newId", -1); $("#table1").editRow("newId"); $("#table1").setCell("newId", "Edit", "); } }); }); //取消编辑状态 functionCancel(id) { if(id == "newId") $("#table1").delRowData("newId"); else$("#table1").restoreRow(id); } //向后台ajax请求新增数据 functionAdd() { varUserId = $("#table1").find("#newId"+ "_UserId").val(); varUserName = $("#table1").find("#newId"+ "_UserName").val(); varAge = $("#table1").find("#newId"+ "_Age").val(); varTel = $("#table1").find("#newId"+ "_Tel").val(); varEmail = $("#table1").find("#newId"+ "_Email").val(); $.ajax({ type: "POST", url: "/Home/Add", data: "UserId="+ UserId + "&UserName="+ UserName + "&Age="+ Age + "&Tel="+ Tel + "&Email="+ Email, success: function(msg) { alert("新增数据: "+ msg); $("#table1").trigger("reloadGrid"); } }); } //向后台ajax请求更新数据 functionUpdate(id) { varUserId = $("#table1").find("#"+>"_UserId").val(); varUserName = $("#table1").find("#"+>"_UserName").val(); varAge = $("#table1").find("#"+>"_Age").val(); varTel = $("#table1").find("#"+>"_Tel").val(); varEmail = $("#table1").find("#"+>"_Email").val(); $.ajax({ type: "POST", url: "/Home/Update", data: "UserId="+ UserId + "&UserName="+ UserName + "&Age="+ Age + "&Tel="+ Tel + "&Email="+ Email, success: function(msg) { alert("修改数据: "+ msg); $("#table1").trigger("reloadGrid"); } }); } //向后台ajax请求删除数据 functionDelete(id) { varUserId = $("#table1").getCell(id, "UserId"); $.ajax({ type: "POST", url: "/Home/Delete", data: "UserId="+ UserId, success: function(msg) { alert("删除数据: "+ msg); $("#table1").trigger("reloadGrid"); } }); }二、实现控制层业务
　　在Controllers目录下新建控制器“HomeController.cs”，Index.js中产生了四个ajax请求，对应控制层也有四个业务方法。HomeController代码如下：
?123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101publicclassHomeController : Controller { UserModel userModel = newUserModel(); publicActionResult Index() { returnView(); } ///  /// 获取全部用户列表，通过json将数据提供给jqGrid ///  publicJsonResult UserList(stringsord, stringsidx, stringrows, stringpage) { var list = userModel.FindAll(); inti = 0; var query = from u inlist select new{ id = i++, cell = newstring[]{ u["UserId"].ToString(), u["UserName"].ToString(), u["Age"].ToString(), u["Tel"].ToString(), u["Email"].ToString(), "-"} }; var data = new{ total = query.Count() / Convert.ToInt32(rows) + 1, page = Convert.ToInt32(page), records = query.Count(), rows = query.Skip(Convert.ToInt32(rows) * (Convert.ToInt32(page) - 1)).Take(Convert.ToInt32(rows)) }; returnJson(data, JsonRequestBehavior.AllowGet); } ///  /// 响应Js的“Add”ajax请求，执行添加用户操作 ///  publicContentResult Add(stringUserId, stringUserName, intAge, stringTel, stringEmail) { Document doc = newDocument(); doc["UserId"] = UserId; doc["UserName"] = UserName; doc["Age"] = Age; doc["Tel"] = Tel; doc["Email"] = Email; try{ userModel.Add(doc); returnContent("添加成功"); } catch{ returnContent("添加失败"); } } ///  /// 响应Js的“Delete”ajax请求，执行删除用户操作 ///  publicContentResult Delete(stringUserId) { try{ userModel.Delete(UserId); returnContent("删除成功"); } catch{ returnContent("删除失败"); } } ///  /// 响应Js的“Update”ajax请求，执行更新用户操作 ///  publicContentResult Update(stringUserId, stringUserName, intAge, stringTel, stringEmail) { Document doc = newDocument(); doc["UserId"] = UserId; doc["UserName"] = UserName; doc["Age"] = Age; doc["Tel"] = Tel; doc["Email"] = Email; try{ userModel.Update(doc); returnContent("修改成功"); } catch{ returnContent("修改失败"); } } }三、实现模型层数据访问
　　最后，我们在Models新建一个Home文件夹，添加模型“UserModel.cs”，实现MongoDB数据库访问代码如下：
?12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061publicclassUserModel { //链接字符串(此处三个字段值根据需要可为读配置文件) publicstringconnectionString = "mongodb://localhost"; //数据库名 publicstringdatabaseName = "myDatabase"; //集合名  publicstringcollectionName = "userCollection"; privateMongo mongo; privateMongoDatabase mongoDatabase; privateMongoCollection mongoCollection; publicUserModel() { mongo = newMongo(connectionString); mongoDatabase = mongo.GetDatabase(databaseName) asMongoDatabase; mongoCollection = mongoDatabase.GetCollection(collectionName) asMongoCollection; mongo.Connect(); } ~UserModel() { mongo.Disconnect(); } ///  /// 增加一条用户记录 ///  ///  publicvoidAdd(Document doc) { mongoCollection.Insert(doc); } ///  /// 删除一条用户记录 ///  publicvoidDelete(stringUserId) { mongoCollection.Remove(newDocument { { "UserId", UserId } }); } ///  /// 更新一条用户记录 ///  ///  publicvoidUpdate(Document doc) { mongoCollection.FindAndModify(doc, newDocument { { "UserId", doc["UserId"].ToString() } }); } ///  /// 查找所有用户记录 ///  ///  publicIEnumerable FindAll() { returnmongoCollection.FindAll().Documents; } }四、小结
　　代码下载：http://files.cnblogs.com/lipan/MongoDB_003.rar
　　自此为止一个简单MongoDB表格数据操作的功能就实现完毕了，相信读者在看完这篇文章后，差不多都可以轻松实现MongoDB项目的开发应用了。聪明的你一定会比本文做的功能更完善，更好。下篇计划讲解linq的方式访问数据集合。
作者：李盼（Lipan）　　出处：[Lipan] （http://www.cnblogs.com/lipan/）
　　版权声明：本文的版权归作者与博客园共有。转载时须注明本文的详细链接，否则作者将保留追究其法律责任。