ASP. NET MVC5 website development my consulting list and adding Consulting (12), mvc5 website development

ASP. NET MVC5 website development my consulting list and adding Consulting (12), mvc5 website development

The last time I completed the consulting architecture, I have now completed the consulting twice: 1. Users and 2. Management. This implementation of the user part contains two functions, check my consulting and consulting.

I. Menus

Open the last added ConsultationController, add Menu action, and return to the distribution view.

/// <Summary> /// Menu /// </summary> /// <returns> </returns> public ActionResult Menu () {return PartialView ();}

Right-click and add view

<Div class = "easyui-accordion"> <div title = "consulting management"> <ul id = "navmenu" class = "nav-pills nav-stacked"> <li> <a href = "javascript: void () "data-options =" 'icons': 'icon-folder-page', 'title': 'consulting management', 'href ':' @ Url. action ("ManageList", "Consultation ") '"> <span class =" glyphicon-list "> consulting management </span> </a> </li> <a href =" javascript: void () "data-options =" 'icons': 'icon-folder-user', 'title': 'My ads', 'href ':' @ Url. action ("MyList", "Consultation ") '"> <span class =" glyphicon-list-alt "> my consulting </span> </a> </li> </ul> </div> </div>

Open the Home/menu view.

Add distributed view reference

Run it and check/Member/Home in the message body. The result is as follows.

2. My Consulting

In my consultation section, use the datagrid to display my consultation list. The datagrid uses the detailed view function and click open and collapse to view details.

The result is as follows:

After opening

This is the extended function of dd. first download jquery-easyui-datagridview.zip from the official network, and then put the jquery. easyui. datagrid. detailview. js file in the project/Scripts folder.

Open the ConsultationController controller, add the MyJsonList method, and return to the json list of my consultations.

public JsonResult MyJsonList(int pageIndex = 1, int pageSize = 20)  {   int _total;   var _list = commonModelService.FindPageList(out _total, pageIndex, pageSize, "Consultation", string.Empty, 0, User.Identity.Name, null, null, 0).ToList().Select(    cm => new Ninesky.Web.Models.CommonModelViewModel()    {     CategoryID = cm.CategoryID,     CategoryName = cm.Category.Name,     DefaultPicUrl = 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 = _list.ToList() });  }

Add the MyList method again and return directly to the view.

/// <Summary> /// my inquiries /// </summary> /// <returns> </returns> public ActionResult MyList () {return View ();}

Right-click to add a view to MyList.

 

@ {ViewBag. title = "my consulting ";} <div id = "toolbar"> <div> <a href = "#" id = "btn_add" class = "easyui-linkbutton" data-options = "iconCls: 'icon-add', plain: true "> consult </a> <a href =" # "class =" easyui-linkbutton "data-options =" iconCls: 'icon-reload', plain: true "onclick =" $ ('# Consultation_List '). datagrid ('reload'); "> refresh </a> </div> <table id =" Consultation_List "> </table> <script src = "~ /Scripts/Common. js "> </script> <script src = "~ /Scripts/jquery. easyui. datagrid. detailview. js "> </script> <script type =" text/javascript "> $ (" # Consultation_List "). datagrid ({loadMsg: 'loading ...... ', FitColumns: true, pagination: true, singleSelect: true, url:' @ Url. action ("MyJsonList", "Consultation") ', columns: [[{field: 'modelid', title: 'id'}, {field: 'title', Title: 'title'}, {field: 'inputer', title: 'consultant ', align: 'right'}, {field: 'releasedate', title: 'consulting date ', align: 'right', formatter: function (value, row, index) {return jsonDateFormat (value) ;},{ field: 'statusstring', title: 'Status', width: 100, align: 'right'}], toolbar: '# toolbar', idField: 'modelid', view: detailview, detailFormatter: function (rowIndex, rowData) {return '<div class = "detail" style = "padding: 5 p x 0"> </div>' ;}, onExpandRow: function (index, row) {var detail = $ (this ). datagrid ('getrowdetail ', index ). find ('div. detail '); detail. panel ({height: 160, border: false, cache: false, href: '@ Url. content ("~ /Member/Consultation/Index ")/'+ row. modelID, onLoad: function () {$ ('# Consultation_List '). datagrid ('fixdetailrowheight', index) ;}}); $ ('# Consultation_List '). datagrid ('fixdetailrowheight', index) ;}}); // Add button $ ("# btn_add "). click (function () {window. parent. addTab ("consult", "@ Url. action ("Add", "Consultation") "," icon-page ") ;}); </script>

This section of code is long and can be explained as follows:

<Div id = "toolbar"> <div> <a href = "#" id = "btn_add" class = "easyui-linkbutton" data-options = "iconCls: 'icon-add', plain: true "> consult </a> <a href =" # "class =" easyui-linkbutton "data-options =" iconCls: 'icon-reload', plain: true "onclick =" $ ('# Consultation_List '). datagrid ('reload'); "> refresh </a> </div>

<Table id = "Consultation_List"> </table>

This is the topic and toolbar of the datagrid.

 

Reference ~ /Scripts/Common. js contains the date formatting method. The date passed in json must be formatted before it can be displayed normally.

Reference ~ /Scripts/jquery. easyui. datagrid. detailview. js is required for the datagrid view.

This is to initialize the datagrid. 1 is to format the date using the jsonDateFormater method in Common. js. 2. View Details

View: detailview,
DetailFormatter: function (rowIndex, rowData) {return '<div class = "detail" style = "padding: 5 p x 0"> </div> ';}

Use the detailed view and add a <DIV>

onExpandRow: function (index, row) {    var detail = $(this).datagrid('getRowDetail', index).find('div.detail');    detail.panel({     height: 160,     border: false,     cache: false,     href: '@Url.Content("~/Member/Consultation/Index")/' + row.ModelID,     onLoad: function () {      $('#Consultation_List').datagrid('fixDetailRowHeight', index);     }    });

This section links to the div of the detailed view during Row Expansion ~ /Member/Consultation/Index/id View

 

Next, we will add the distribution view Consultation/Index.

Add Index action to the Controller and return the distribution View

public ActionResult Index(int id)  {   return PartialView(commonModelService.Find(id).Consultation);  }

Right-click to add a Consultation distribution View

@ Model Ninesky. models. consultation <table style = "width: 100%"> <tr> <th> @ Html. displayNameFor (model => model. name) </th> <td> @ Html. displayFor (model => model. name) </td> <th> @ Html. displayNameFor (model => model. isPublic) </th> <td> @ Html. displayFor (model => model. isPublic) </td> </tr> <th> @ Html. displayNameFor (model => model. QQ) </th> <td> @ Html. displayFor (model => model. QQ) </td> <th> @ Html. displayNameFor (m Odel => model. email) </th> <td> @ Html. displayFor (model => model. email) </td> </tr> <th> @ Html. displayNameFor (model => model. content) </th> <td colspan = "3"> @ Html. displayFor (model => model. content) </td> </tr> <td colspan = "4"> @ if (Model. replyTime! = Null) {<span> administrator at: @ Model. replyTime: </span> <p style = "margin-top: 8px"> @ Model. replyContent </p >}</td> </tr> </table>

Finished

3. Consult

Add action on the Consultation Controller

/// <Summary> /// Add /// </summary> /// <returns> </returns> public ActionResult Add () {InterfaceUserService _ userService = new UserService (); var _ user = _ userService. find (User. identity. name); CommonModel _ cModel = new CommonModel (); _ cModel. consultation = new Consultation () {Email = _ user. email, IsPublic = true, Name = _ user. displayName}; _ user = null; _ userService = null; return View (_ cModel );}

First query user information in the action, construct a CommonModel, and pass it to the view.

Right-click to add view

@ Model Ninesky. models. commonModel @ {ViewBag. title = "consult";} @ using (Html. beginForm () {@ Html. antiForgeryToken () 
It is very similar to adding an article. The following describes the acceptance method.
Add action to the Controller again

[HttpPost]  [ValidateAntiForgeryToken]  public ActionResult Add(CommonModel commonModel)  {   if(ModelState.IsValid)   {    InterfaceUserService _userService = new UserService();    var _user = _userService.Find(User.Identity.Name);    if (commonModel.Article != null) commonModel.Article = null;    if (commonModel.Attachment != null) commonModel.Attachment = null;    if (commonModel.DefaultPicUrl != null) commonModel.DefaultPicUrl = null;    commonModel.Hits = 0;    commonModel.Inputer = User.Identity.Name;    commonModel.Model = "Consultation";    commonModel.ReleaseDate = System.DateTime.Now;    commonModel.Status = 20;    commonModel.Consultation.Name = _user.DisplayName;    _user = null;    _userService = null;    commonModel = commonModelService.Add(commonModel);    if (commonModel.ModelID > 0) return View("AddSucess", commonModel);   }   return View(commonModel);  }
If the verification passes in the action, first find the user and set Article and Attachment to null, which prevents the user from secretly carrying private goods. Then initialize and save the Hits and Inputer fields of commonModel.
Effect:


My consultation provides two functions: view my consultation and consult, and view the detailed view using the datagrid.
The above is the whole process of my consulting list and the implementation of adding consulting, and I hope it will help you learn.