ASP. net mvc + EasyUI permission design (3) Basic module

Source: Internet
Author: User

Please indicate reprinted address: http://www.cnblogs.com/arhat

In the previous chapter, we have basically set up the environment. In this chapter, we will start from the basic module. Because users, roles, and actions all depend on and act on each other, this chapter begins with the action. First, we need to establish this basic module before we can take the user, associate roles with actions to form permissions.

First, create a new Controller as ActionController and create a View File for its Index method. Because there are too many view files and there are too many repetitive code, so we port the common parts to Views/Shared/_ Layout. in cshtml, in other words, the template is used.

The content of _ Layout. cshtml is as follows:

<!DOCTYPE html>

Then we create the View File of the Index method of ActionController. The content is as follows:

@ {ViewBag. title = "Action Settings"; Layout = "/Views/Shared/_ Layout. cshtml ";} @ section script {$ (document ). ready (function () {initActionGrid () ;}); function initActionGrid () {$ ("# grid "). datagrid ({url: '/Action/loadactiondata', fitColumns: true, rownumbers: true, toolbar: [{iconCls: 'sys-icon-add', text: "Add action", handler: addAction}], columns: [{field: 'aid ', title: 'id', width: 10, align: 'center '}, {field: 'aname', tit Le: 'Action name', width: 200, align: 'center'}, {field: 'avalue ', title: 'Action value', width: 200, align: 'center'}, {field: 'opt', title: 'operation', width: 70, align: 'center', formatter: function (v, r, I) {return "<a href = 'javascript: delAction (" + r. AId + ") '>  </a> <a href = 'javascript: editAction (" + r. AId + ") '>  </a>" ;}}]});} function addAction () {$ ('# d Ialog '). dialog ({title: 'add action', iconCls: "sys-icon-add", width: 400, height: 300, closed: false, cache: false, modal: true, onClose: function () {$ ("# grid "). datagrid ("reload") ;}, content: createIFrame ("/Action/AddAction") };} function delAction (_ aid) {$. messager. confirm ("prompt", "Are you sure you want to delete this action? ", Function (B) {if (B) {$. get ("/Action/DelAction/", {aid: _ aid}, function (data) {if (data = "y") {$ ("# grid "). datagrid ("reload") ;}}, "text") ;}}}< table id = "grid" data-options = "fit: true "> </table> <div id =" dialog "style =" overflow: hidden "> </div>

Here, the DataGrid and Dialog components of EasyUI are used, and corresponding JS functions are used to perform CRUD operations on actions.

In the initActionGrid function, our team Grid performs some initialization operations. From the parameters, we can see that our data loading is completed through the Action/LoadData, so we add this method to ActionController.

[HttpPost]public ActionResult LoadActionData(){var json = new { total = permitBLL.GetAllActionList().Count, rows = permitBLL.GetAllActionList() };return Json(json,JsonRequestBehavior.DenyGet); }

This method uses an instance of the B _Permit class to obtain data. Let's take a look at the content of this class:

# Region Query Method /// <summary> /// obtain all actions /// </summary> /// <returns> </returns> public List <Model. m_ArHat_Action> GetAllActionList () {List <Model. m_ArHat_Action> list = null; DataTable dt = permitDAL. selectAllAction (); if (dt! = Null & dt. rows. count> 0) {list = new List <Model. m_ArHat_Action> (); Model. m_ArHat_Action action = null; foreach (DataRow row in dt. rows) {action = new Model. m_ArHat_Action (); action. AId = Convert. toInt32 (row ["AId"]); action. AName = row ["AName"]. toString (); action. AValue = row ["AValue"]. toString (); list. add (action) ;}} return list ;} # endregion # Add method of region /// <summary> /// add an Action /// </summary> /// <param name = "action"> </param> public void AddAction (Model. m_ArHat_Action action) {permitDAL. addAction (action) ;}# endregion

This class provides two methods: one for query and the other for insert. Of course, here we certainly need the merits of the DAL layer. At the same time, let's take a look at the contents of D_Permit.cs In the DAL:

Public class D_Permit {# region SQL statement // query all actions (not paginated) private static readonly string sql1 = "select * from ArHat_Action order by AId Desc "; // Add an action private static readonly string sql2 = "insert into ArHat_Action values (@ AName, @ AValue )"; # endregion # Add method of region /// <summary> /// add an action /// </summary> /// <param name = "action"> </param> public void AddAction (Model. m_ArHat_Action action) {SqlParameter [] parameters = {new SqlParameter ("@ AName", SqlDbType. varChar, 50), new SqlParameter ("@ AValue", SqlDbType. varChar, 50)}; parameters [0]. value = action. AName; parameters [1]. value = action. AValue; DAL. sqlHelper. executeNonQuery (sql2, parameters );} # endregion # region Query Method // <summary> // query all actions /// </summary> /// <returns> </returns> public DataTable SelectAllAction () {return DAL. sqlHelper. executeQuery (sql1) ;}# endregion}

In this class, we implement the query of actions and the addition of SQL. Speaking of this, if we want to make the project more flexible, we should add interface-oriented programming on the basis of the three-tier architecture. In other words, we have to create an IDAL and IBLL project, it is best to write abstract operations on the database and business logic in these two projects. However, because the Old Wei project is relatively small, it is not written in this way, if you are interested, you can discuss it in the QQ group.

Now let's take a look at the final running results.

[HttpGet] public ActionResult AddAction () {return View ();} /// <summary> /// Add action Post /// </summary> /// <param name = "action"> </param> /// <returns> </returns> [HttpPost] public ActionResult AddAction (Model. m_ArHat_Action actionInfo) {try {permitBLL. addAction (actionInfo); StringBuilder sb = new StringBuilder (); sb. append (@ "<script> parent. $ ("" # dialog ""). dialog ("" close ""); </script> "); return Content (sb. toString ();} catch (Exception ex) {return Content ("failed to add:" + ex. message );}}

Here, because Old Wei didn't use Jquery. unobtrusie-ajax.js provided by jquery, so here the Content is used to execute the method of closing the dialog box. Of course, on the UI side, you should note that you should set an onClose event for the Dialog so that the parent page can be refreshed when it is closed.

As for deletion, Old Wei did not do it here. If you encounter it during the process, we hope to implement it on our own. This chapter is written here. Although it is a bunch of code, it seems nothing, but it is really hard to write JavaScript.

Sorry, my wife's due date is coming, so the subsequent chapters may be slower than new ones, but Wei promised that he would not die.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.