NHibernate3.3.0GA+ExtJS4.1.1+ASP.NET MVC3.0权限管理系统（5）-ASP.NET MVC的引入

通过前面几章的介绍，ExtJS从框架页的设计、Grid列表显示、以及编辑界面的Form表单。通过ExtJS，我们开发的是完全独立的客户端部分，不依赖于服务端平台。接下来，我们需要实现的是客户端和服务端的数据交互功能。服务端的技术，可以根据自身技术进行选择，这里我采用APS.NET MVC来实现，当然，也可以是Java、PHP、Ruby等待。

为了能更好的分清层次，这里把Controller和Model层从Web项目中分离出来，作为解决项目的两个类库Controllers和Model。

Controllers类库中，需要引用的类库如下：

System.Web：提供使得可以进行浏览器与服务器通信的类和接口。

System.Web.Routing ：URL路由。将一个URL路由到对应的Controller上靠的就是这个,是在HttpModule里面处理的。

System.Web.Extensions ：这个是ASP.NET AJAX的。

System.Web.Mvc: ASP.NET MVC最主要的程序集。在CodePlex上放出源代码的就是这个DLL。

System.Web.Abstractions ：这个程序集是一些相关的基类来的。例如HttpContextBase、HttpRequestBase 等等。

这样，我们就可以开始进行前后台的数据交互的工作了，我们就先考虑框架页中左边的菜单导航部分，我们在Controllers类库中创建一个MenuController类，并继承Controller（System.Web.Mvc.Controller）。具体的类代码如下：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.Mvc;
using DAL.SystemManage;
using Common;
using NHibernate;
using NHibernate.Cfg;
using Model.Entity.SystemManage;
using System.Data;
using Newtonsoft.Json;

namespace Controllers.SystemManage
{
    public class MenuController:Controller
    {
        /// <summary>
        /// 返回所有菜单信息的json
        /// </summary>
        /// <returns></returns>
        public string Index()
        {
            return  
"[{\”id\”:1,\”vcName\”:\”用户管理\”,\”iParent\”:0,\”vcPictureUrl\”:null,\”iGroup\”:1,\”vcUrl\”:\”userlist\”},{\”id\”:2,\”vcName\”:\”用户组管理\”,\”iParent\”:0,\”vcPictureUrl\”:null,\”iGroup\”:2,\”vcUrl\”:\”grouplist\”},{\”id\”:3,\”vcName\”:\”动作管理\”,\”iParent\”:0,\”vcPictureUrl\”:null,\”iGroup\”:3,\”vcUrl\”:\”actionlist\”},{\”id\”:4,\”vcName\”:\”角色管理\”,\”iParent\”:0,\”vcPictureUrl\”:null,\”iGroup\”:4,\”vcUrl\”:\”rolerlist\”},{\”id\”:5,\”vcName\”:\”角色权限管理\”,\”iParent\”:0,\”vcPictureUrl\”:null,\”iGroup\”:5,\”vcUrl\”:\”rolelist\”},{\”id\”:8,\”vcName\”:\”菜单管理\”,\”iParent\”:0,\”vcPictureUrl\”:null,\”iGroup\”:6,\”vcUrl\”:\”menulist\”}]";
        }
    }
}

有了Index方法之后，我们就可以通过URL来进行访问了。实现客户端和服务端的交互，我们还需要修改app/store /WestTree.js中的代码，主要修改其中的URL，代码如下：

Ext.define('RoleManage.store.WestTree', {
    extend: 'Ext.data.TreeStore',
    model: 'RoleManage.model.WestTree',
    autoLoad: true,
    proxy: {
        type: 'ajax',
        url: 'Menu/Index',//url访问Controller中MenuCnotroller的Index方法(Action方法)
        reader: {
            type: 'json',
            successProperty: 'success'
        }
    }

}); 

        

通过如上步骤，简单的前后台数据交互就已经实现了！

 

推荐下自己的淘宝小店女装：诗语情裳