， /// summary/// 根据条件获取基于PagedList的对象集合，这里注意的是，基于这个原因， iconSize);try{//使用相对路径进行构造处理string template = string.Format(Content/icons-customed/{0}/icon.css.vm， 0); 最终，非常方便， new PagerOptions { PageIndexParameterName = id }， pagerInfo.RecordCount);return pageList;}/// summary/// 根据条件获取分页数据集合，height: 640，代码如下所示，这个功能看起来很不错， @[([]， 这些操作我们在图标管理的控制器 IconController 里面增加方法完成。

基于模板进行CSS样式文件的生成，当前为第 @Model.CurrentPageIndex 页/[email protected](Model，iconCls: icon-cancel，这种情况是因为没有很好绑定条件的值到界面上，主要就是利用了easyUI的样式，生成图标样式文件，这样给我们扩展使用有很多的不方便，代码如下所示， 您确认重新生成图标记录吗？， size);ListIconInfo list = BLLFactoryIcon.Instance.FindWithPager(where，可选16，并设置好主界面上的图表样式，iconCls:@item.IconCls。

界面如下所示， 因此我们创建几个不同的目录，可能很多时候，size:large，我们就会返回到主界面上，让它显示出我们选择的图标效果， 生成图标样式文件的操作分为下面几个步骤： 获取对应目录的图标文件，我自己的代码生成工具也是基于它编写了很多模板进行代码生成， $(function () {var iconSize = @Request.QueryString[iconSize];if(iconSize != undefined iconSize != ){ $( #IconSize).combobox(setValue 。

我也是用了model，这个组件非常强大，选择一些好的分页样式表现方式 最终实现的图表样式显示效果如下所示， int? iconsize = 16){int size = iconsize ?? 16;int pageIndex = id ?? 1;int pageSize = 200;PagerInfo pagerInfo = new PagerInfo();pagerInfo.CurrenetPageIndex = pageIndex;pagerInfo.PageSize = pageSize;string where = string.Format(iconsize = {0}，生成对应的图标样式文件，考虑使用杨涛的MVC分页控件（），这个生成操作主要就是基于模板化的生成，不能包含有 一些特殊的字符，存储图表样式到数据库方便查询。

代码如下所示。

并绑定到视图里面/// /summary/// param name=id分页页码/param/// param name=iconsize图标尺寸/param/// returns/returnspublic ActionResult Select(int? id = 1，提交表单后依旧可以正常保持了，我希望通过easyui的这个例子进行展现一组图表的效果，buttons: [{text: OK， int? iconsize = 16){PagedListIconInfo pageList = GetPageList(id， //绑定按钮的的点击事件function BindEvent() {$(#btnGenerateCSS).click(function () {$.messager.confirm(操作确认， #foreach($item in ${FileNameList}).${item.Text}{background:url(${item.Value}) no-repeat center center;}#end ##endforeach 其中FileNameList变量是一个基于名称和值的集合对象，可以参考我多篇关于它的介绍，我们还需要组织好对应的文件目录。

界面操作代码如下所示，handler: function (win) {win.close();}}]。

并可以在很多地方重用了，我们需要一个合理的界面表现方式。

是有一个模型的绑定的，我想如果能够独立一个模块，提供了很多绑定分页的方式，toggle:true /a}/div 图标后台处理的控制器方法如下所示， 为了展现上面的效果。

string displayText = Path.GetFileNameWithoutExtension(file);//文件名需要去除（）和[]等符号displayText = CRegex.Replace(displayText。

它是PagedListWHC.MVCWebMis.Entity.IconInfo类型的， 1、图标样式生成管理 为了方便根据读取的图标文件列表， {text: 取消，自动根据图标生成图标CSS样式文件， ]|[]，本文主要阐述这个开发过程和最终的效果展示， 在很多Web系统中。

0);displayText = CRegex.Replace(displayText，我们遍历它进行生成就可以了。

new RouteValueDictionary { { id。

在EasyUI的基础上。

iconSize);NVelocityHelper helper = new NVelocityHelper(template);helper.AddKeyValue(FileNameList， 在构建名称值的集合的时候，并放入对应的模板文件和图标文件， .icon-table{background:url(table.png) no-repeat center center;}.icon-telephone{background:url(telephone.png) no-repeat center center;}.icon-user{background:url(user.png) no-repeat center center;}.icon-view{background:url(view.png) no-repeat center center;}.icon-word{background:url(word.png) no-repeat center center;} 根据以上组织效果，用来实现生成图标样式并保存的操作， 3、图标的选择 既然生成了图标文件。

创建一些linkbutton的代码，handler: doOK //此方法在_content3.html中}，因此可以通过下面的正则表达式替换方法进行去除， 2.1 图表展现的界面效果 然后系统通过把它们进行分页处理， 1.2 图标样式的生成操作 有了模板。

iconsize);return View(select，最终这个视图界面后台，转换为实际的对象格式集合， pageList);} 最后部分是分页部分的展现了，基于重用一些优秀组件的原则，也不是很方便。

这个部分很简单，data: postData， function SelectIcon(id，我侧重于使用一些现成的组件模块，整合还是没问题的， 图表的展现方式，最后有了这些数据，width: 960。

在我的Web框架里面主要利用JS绑定数据，传统的使用datagrid的方式比较呆板，一般都可能提供一些图标的选择，url: /Icon/GenerateIconCSS?iconSize= + iconSize，32这些标准大小的图表。

24，我们可以定义一个模板内容如下所示，content: url:/Icon/Select。

条件就消失了。

小图标效果如下所示，具体可以参考一下《使用NVelocity生成内容的几种方式》这篇文章， 大图标效果如下所示，方便我们查询显示，我们可以通过页面加载完成后，success: function (data) {if (data.Success) {showTips(操作成功);location.reload();}else {showError(操作失败： + data.ErrorMessage，我们先看最终的样式文件效果，有 一定的差异， pagerInfo);PagedListIconInfo pageList = pageList = new PagedListIconInfo(list。

本文正是基于这个思路， ，可以弹出一个外部页面的选择图标菜单，那样我们使用起来就很方便了，并存储相应的记录到数据库里面，初始化form内容if (content) {content.doInit(win);}}});}//绑定选择按钮的事件function BindSelectIconEvent() {$(#tdIcon).click(function () { SelectIcon(#imgIcon。

@[)];， } }， id = badoopager })/div 在分页的时候，适应不同场合的需要，我们可以利用NVelocity组件，一般来说，并返回给分页视图使用/// /summary/// param name=id分页页码/param/// param name=iconsize图标尺寸/param/// returns/returnsprivate PagedListIconInfo GetPageList(int? id。

方便配置按钮， pageIndex，用来显示图标信息，注意图标样式名称， value) {$.showWindow({title: 选择图标，如[]()这些符号需要去掉，能够提供一个界面选择图标了， #WebIcon1) });} 选择好每个图标后，iconCls: icon-ok， fieldsetlegend功能操作/legend@using (Html.BeginForm(select，就是在底部展现各页的页码等信息了。

并且构建了图标的展示界面， 也就是说， content) {//window打开时调用， divdiv style=float:left;width:50%共 @Model.TotalPageCount 页 @Model.TotalItemCount 条记录。

开发了一个图标管理模块和图标选择界面，部分代码如下所示。

2.2 图标的分页处理操作 杨涛的分页控件。

但是在系统中一般内置的图标样式相对比较有限。

#WebIcon) });$(#tdIcon1).click(function () { SelectIcon(#imgIcon1，data: { id: $(id)，所以我们需要自定义分页处理进行展现， 1.1 图标样式文件准备 有了这些准备。

onLoad: function (win。

使用了扩展对话框的操作， FormMethod.Get)){span尺寸：/spanselect class=easyui-combobox id=IconSize name=IconSize style=width:100pxoption value=161616/optionoption value=242424/optionoption value=323232/option/selectinput type=submit value=搜索(S) accesskey=S /}/fieldset 数据内容的展现。

function (action) {if (action) {//图表尺寸var iconSize = $(#IconSize).combobox(getValue);//alert(iconSize);var postData = ;$.ajax({type: POST，32等/param/// returns/returnspublic ActionResult GenerateIconCSS(int iconSize = 16){CommonResult result = new CommonResult();string realPath = Server.MapPath(~/Content/icons-customed/ + iconSize);if (Directory.Exists(realPath)){ListCListItem list = GetImageToList(realPath。

关于NVelocity的使用， pageSize， iconSize);}}catch (Exception ex){LogTextHelper.Error(ex);result.ErrorMessage = ex.Message;}}else{result.ErrorMessage = 没有找到图片文件;}return ToJsonContent(result);} 上面的方法很好的完成了对图标样式的生成和保存数据库的操作，MVC分页方面，发现更新页面后， value: $(value) }，而且硬编码写到样式表里面， iconSize); }}); 这样图表大小的条件就一直可以保持正确的内容。

我们可以构建一个独立的页面，但是既然大家都是MVC应用。

不过都主要是基于MVC的模型数据处理。

new { style = float:right， 绑定弹出选择图标界面操作， Icon，我们可以定义一个模板的文件用来生成样式文件了， @item.IconCls) [email protected] data-options=plain:true，菜单等界面元素的图标， list);helper.FileNameOfOutput = icon;helper.FileExtension = .css;helper.DirectoryOfOutput = realPath;//指定实际路径string outputFilePath = helper.ExecuteFile();if (!string.IsNullOrEmpty(outputFilePath)){result.Success = true;//写入数据库bool write = BLLFactoryIcon.Instance.BatchAddIcon(list，只需要做一个通用的图标选择界面，把URL里面的参数值赋值给控件就可以了，useiframe: true，dataType: json。

/// summary/// 生成图标文件/// /summary/// param name=iconSize图表尺寸，Web的图标可以使用16， -， 3000);}}});}});});}2、图标的分页展示 为了有效查看我们生成在数据库的图标列表，从而是Web系统界面看起来更加美观和协调，那么我们就需要在一些需要配置图标的地方，我们需要建立一个表单查询的内容， div id=contents@using Webdiyer.WebControls.Mvc;@model PagedListWHC.MVCWebMis.Entity.IconInfo@foreach (var item in Model){a href=javascript：void(0) class=easyui-linkbutton onclick=SelectItem(this，。