ASP. NET MVC5 website development Display Article list (9), mvc5 website development

ASP. NET MVC5 website development Display Article list (9), mvc5 website development

Old habits: first:

1. In the IBLL
Add a method to obtain the public model list in the InterfaceCommonModelService interface.
First sort method

/// <Summary> /// sort /// </summary> /// <param name = "entitys"> data entity set </param> /// <param name = "roderCode"> sort code [default: ID descending Order] </param> // <returns> </returns> IQueryable <CommonModel> Order (IQueryable <CommonModel> entitys, int roderCode ); data Query Method /// <summary> /// query the paging data list /// </summary> /// <param name = "totalRecord"> total number of records </param> /// <param name = "model"> model [All] </param> // <param name = "pageIndex"> page number </param> /// <param name = "pageSize"> Number of records per page </param> // <param name = "title"> title [do not use a Null String] </param>/ // <param name = "categoryID"> topic ID [do not use set 0] </param> // <param name = "inputer"> User name [do not use set Null String] </param> /// <param name = "fromDate"> Start Date [can be null] </param> /// <param name = "toDate"> end date 【 can be null. </param> /// <param name = "orderCode"> Sorting Code </param> /// <returns> paging data list </returns> IQueryable <CommonModel> FindPageList (out int totalRecord, int pageIndex, int pageSize, string model, string title, int categoryID, string inputer, Nullable <DateTime> fromDate, Nullable <DateTime> toDate, int orderCode );

2. BLL

The implementation code of writing methods in CommonModelService is simple. The main idea is to directly write the code public IQueryable <CommonModel> FindPageList (out int totalRecord, int pageIndex, int pageSize, string model, string title, int categoryID, string inputer, Nullable <DateTime> fromDate, Nullable <DateTime> toDate, int orderCode) {// obtain the Object List IQueryable <CommonModel> _ commonModels = CurrentRepository. entities; if (model = null | model! = "All") _ commonModels = _ commonModels. Where (cm => cm. Model = model); if (! String. isNullOrEmpty (title) _ commonModels = _ commonModels. where (cm => cm. title. contains (title); if (categoryID> 0) _ commonModels = _ commonModels. where (cm => cm. categoryID = categoryID); if (! String. IsNullOrEmpty (inputer) _ commonModels = _ commonModels. Where (cm => cm. Inputer = inputer); if (fromDate! = Null) _ commonModels = _ commonModels. Where (cm => cm. ReleaseDate> = fromDate); if (toDate! = Null) _ commonModels = _ commonModels. where (cm => cm. releaseDate <= toDate); _ commonModels = Order (_ commonModels, orderCode); totalRecord = _ commonModels. count (); return PageList (_ commonModels, pageIndex, pageSize ). asQueryable ();} public IQueryable <CommonModel> Order (IQueryable <CommonModel> entitys, int orderCode) {switch (orderCode) {// default sorting default: entitys = entitys. orderByDescending (cm => cm. releaseDate); break;} return entitys ;}

3. web
Because the CommonModel is inconsistent with the data displayed on the front-end, a view model CommonModelViewModel is constructed in Ninesky. Web. Models to take care of the data displayed in the datagrid.

Using System; namespace Ninesky. web. models {/// <summary> /// CommonModel view model /// <remarks> /// create: 2014.03.10 /// </remarks> /// </summary> public class CommonModelViewModel {public int ModelID {get; set ;} /// <summary> /// topic ID /// </summary> public int CategoryID {get; set ;} /// <summary> /// topic name /// </summary> public string CategoryName {get; set ;} /// <summary> /// Model name /// </summary> public string Model {get; set ;} /// <summary> /// Title /// </summary> public string Title {get; set ;} /// <summary> /// accessors /// </summary> public string Inputer {get; set ;} /// <summary> /// click /// </summary> public int Hits {get; set ;} /// <summary> /// release date /// </summary> public DateTime ReleaseDate {get; set ;} /// <summary> /// Status /// </summary> public int Status {get; set ;} /// <summary> /// status text /// </summary> public string StatusString {get {return Ninesky. models. commonModel. statusList [Status] ;}/// <summary> // homepage image /// </summary> public string DefaultPicUrl {get; set ;}}}

Add a JsonList method that returns json in ArticleController.

/// <Summary> // The document list is in Json format. [Do you have permission restrictions? Can you access them ?] /// </Summary> /// <param name = "title"> title </param> /// <param name = "input"> input </param>/ // <param name = "category"> topic </param> /// <param name = "fromDate"> Start date </param> /// <param name =" toDate "> end date </param> /// <param name =" pageIndex "> page number </param> /// <param name =" pageSize "> records on each page </param> // <returns> </returns> public ActionResult JsonList (string title, string input, Nullable <int> category, Nullable <DateTime> fromDate, Nullable <DateTime> toDate, int pageIndex = 1, int pageSize = 20) {if (category = null) category = 0; int _ total; var _ rows = commonModelService. findPageList (out _ total, pageIndex, pageSize, "Article", title, (int) category, input, fromDate, toDate, 0 ). select (cm => new Ninesky. web. models. commonModelViewModel () {CategoryID = cm. categoryID, CategoryName = cm. category. name, defapicpicurl = cm. defaultPicUrl, Hits = cm. hits, Inputer = cm. inputer, Model = cm. model, ModelID = cm. modelID, ReleaseDate = cm. releaseDate, Status = cm. status, Title = cm. title}); return Json (new {total = _ total, rows = _ rows. toList ()});}

The following is an interface. In the Add List method, no data is provided here, and the data is obtained in JsonList.

/// <Summary> // all articles /// </summary> /// <returns> </returns> public ActionResult List () {return View ();}

Right-click to add view

<Div id = "toolbar"> <div> <a href = "#" class = "easyui-linkbutton" data-options = "iconCls: 'icon-edit', plain: true "> modify </a> <a href =" # "class =" easyui-linkbutton "data-options =" iconCls: 'icon-delete', plain: true ""> Delete </a> <a href = "#" class = "easyui-linkbutton" data-options = "iconCls: 'icon-reload', plain: true "onclick =" $ ('# article_list '). datagrid ('reload'); "> refresh </a> </div> <div class =" form-inline "> <label> column </lab El> <input id = "combo_category" data-options = "url: '@ Url. action ("JsonTree", "Category", new {model = "Article "}) '"class =" easyui-combotree "/> <label> title </label> <input id =" textbox_title "class =" input-easyui "style =" width: 280px "/> <label> input by </label> <input id =" textbox_inputer "class =" input-easyui "/> <label> Add date </label> <input id = "datebox_fromdate" type = "datetime" class = "easyui-datebox" style = "width: 1 20px "/>-<input id =" datebox_todate "type =" datetime "class =" easyui-datebox "style =" width: 120px; "/> <a href =" # "id =" btn_search "data-options =" iconCls: 'icon-search' "class =" easyui-linkbutton "> query </a> </div> <table id =" article_list "> </table> <script src = "~ /Scripts/Common. js "> </script> <script type =" text/javascript ">$ (" # article_list "). datagrid ({loadMsg: 'loading ...... ', Pagination: true, url:' @ Url. action ("JsonList", "Article") ', columns: [{field: 'modelid', title: 'id', checkbox: true}, {field: 'categoryname', title: 'topic '}, {field: 'title', Title: 'title'}, {field: 'inputer', title: 'input', align: 'right'}, {field: 'hits ', title: 'click', align: 'right'}, {field: 'releasedate', title: 'publication date ', align: 'right', formatter: function (value, row, index) {return jsonDateFormat (value) ;},{ field: 'statusstring', title: 'status ', width: 100, align: 'right'}], toolbar: '# toolbar', idField: 'modelid',}); // find $ ("# btn_search "). click (function () {$ ("# article_list "). datagrid ('load', {title: $ ("# textbox_title "). val (), input: $ ("# textbox_inputer "). val (), category: $ ("# combo_category "). combotree ('getvalue'), fromDate: $ ("# datebox_fromdate "). datebox ('getvalue'), toDate: $ ("# datebox_todate "). datebox ('getvalue')}) ;}</script>

The content above is easyui-datagrid.
The general idea is to query the Public Model List in BLL. Add a JsonList method in the web to call the method in BLL and return the Json type of the list. Then add a List to call JsonList for display. In the next article, we will delete and modify it. I hope you will continue to pay attention to it.