JqueryEasyUi

学习了几天EasyUI，很多事情都要自己试过才知道，小问题会浪费很多时间。

一、JQuery AJAX 的后台

1. Session变量

后台的实现很简单，最常见的就是使用ashx。但如果要在后台处理程序中使用到Session变量，则必须继承System.Web.SessionState.IRequiresSessionState接口。

例：

public class MenuHandler : IHttpHandler, System.Web.SessionState.IRequiresSessionState

因为菜单往往与用户权限关联，用户信息一般是在登录成功后放入Session变量中的，所以动态生成菜单时，必须要读取Session变量。这时候就必须继承（系统自动实现） IRequiresSessionState接口。

2. 文件上传

Form里别忘了加"multipart/form-data"！否则后台Request.Files里是取不到上传文件的。

例：< form id="ImportForm" runat="server" enctype="multipart/form-data" >

如果用了EasyUI的FileBox，而没用服务器控件，后台就要用Request.Files读取文件列表了，其实就是一个标准的input标签。

二、动态添加内容（JQuery）

想用Panel做个简单的导航菜单，类似于MenuButton的官方Demo，只不过菜单项是由多个按钮组成，由后台根据权限动态生成。但Panel不提供动态添加内容的方法，只有装载远端页面的功能。其实是我不理解Panel的真实用意，它是个可以装任何东西容器，不是只装菜单按钮的ToolBar，当然不提供Add之类的方法了。搜了大半天，终于找到了一篇好文章：《 easyui,jquery动态生成menubutton》 。原来JQuery已经对所有的对象（除了HTML）封装，提供了  append()  、 prepend() 等一堆的方法，直接拿来用就是了，真是强大啊。

代码示例：

function createMenu(divMenu) {

      $.post('getMenu.ashx', null, function (data) {

            var menuStr = '';

            var subMenuStr = '';

            $.each(data, function (i, node) {

                  menuStr += '< a id="MainMenu' + i + '" href="#" class="easyui-';

                  if (node.menus.length > 0) {      //has submenu

                        menuStr += 'menubutton" data-options="menu:\'#menu' + i +'\'">';

                        subMenuStr='< div id="menu'+ i + '">';

                        $.each(node.menus, function (j, o) {

                              subMenuStr += '< div > ' + o.name + '</ div>';

                        })

                        subMenuStr += '</ div>';

                  }

                  else

                        menuStr += 'linkbutton" data-options="plain:true">';

                  menuStr += node.title + '</ a>';

                  menuStr += subMenuStr;

            });

            $('#' + divMenu).prepend($(menuStr));

            for (var i=0;i

                  $('#MainMenu' + i).menubutton();

      }, "json");

}

三、校验

 <input name="title" id="title" class="easyui-validatebox" required="true" required="true" validType="length[0,20]" invalidMessage="不能超过20个字符！">

 

<input name="End" id="End" class="easyui-numberbox" required="true" validType="length[0,20]" invalidMessage="不能超过20个字符！">
<span  style="color:red">*请输入数字</span>