项目经历——EasyUI的检索和更新操作

什么事都耐不住“磨”？！

比如一个让人很头疼的问题，对于项目中所用到的EasyUI框架就是一个很明显的感受。项目使用的EasyUI框架，自身封装好的样式使得开发者不用考虑具体的div和css样式了，但是却折腾的接手项目不久的我们。那谁说的，生命不息，折腾不止，今天也来折腾一下EasyUI的简单操作——对EasyUI的增删改查。

业务分析：

1、页面加载的时候，从数据库对应的表或视图中检索对应的记录显示在页面上面；
2、设置时间或者通过不通过条件，可以根据设置的条件显示具体的数据
3、单击认证，将审阅状态和是否认证都修改成Yes，取消认证则将两者修改成No；

功能实现：

查询操作：

Html代码：

	    <%--表格显示区--%>
	    <table id="tt" title="审核日志信息" class="easyui-datagrid" style="width: auto; height: 370px" idfield="itemid" pagination="true" iconcls="icon-save"
	        data-options="rownumbers:true,url:'ExamineVerifyLog.ashx/ProcessRequest',pageSize:5,pageList:[5,10,15,20],method:'get',toolbar:'#tb' ," fitcolumns="true" striped="true">
	        <%-- 表格标题--%>
	        <thead>
	            <tr>
	                <th data-options="field:'ck',checkbox:true"></th>
	                <th data-options="field:'RealName',width:100">用户名</th>
	                <th data-options="field:'Title',width:120,align:'right'">日志标题</th>
	                <th data-options="field:'PublishDate',width:100">时间</th>
	                <th data-options="field:'ExamineSign',width:100">审阅状态</th>
	                <th data-options="field:'ExamineMessage',width:100">通知</th>
	                <th data-options="field:'ExamineSign',width:60,align:'left'">是否认证</th>
	            </tr>
	        </thead>
	        <input type="hidden" id="test" name="test" />
	    </table>

	 <%--工具栏-包括按时间查找、按是否通过代码审核查找、查找按钮--%>
	    <div id="tb" style="padding: 5px; height: auto">
	        <div>
	            时间从:
	            <input id="StartTime" name="StartTime" class="easyui-datebox" style="width: 100px" />
	            到:
	            <input id="EndTime" name="EndTime" class="easyui-datebox" style="width: 100px" /> 
	           机器审核:
	            <select class="easyui-combobox" id="Category" name="Category" panelheight="auto" style="width: 100px">
	                <option value="Yes">通过</option>
	                <option value="No">未通过</option>
	            </select>
			<a href="#" class="easyui-linkbutton" iconcls="icon-search" onclick="reloadgrid()">Search</a>
			<a href="#" id ="renzheng" class="easyui-linkbutton" iconcls="icon-add" style="margin-left: 360px" onclick="modify('Yes')">认证</a>  
			<a href="#" id="cancelrenzheng" class="easyui-linkbutton" iconcls="icon-remove" onclick="modify('No')">取消认证</a>
	        </div>
	    </div>

        //查询并把数据传递给后台，数组
        function getQueryParams(queryParams) {
            var StartTime = $("#StartTime").datebox("getValue");
            var EndTime = $("#EndTime").datebox("getValue");
            //var KeyWord = document.getElementById("KeyWord").value;
            var Category = $("#Category").combobox("getValue");
            queryParams.StartTime = StartTime;
            queryParams.EndTime = EndTime;
            //queryParams.KeyWord = KeyWord;
            queryParams.Category = Category;
            return queryParams;
        }

        //增加查询参数，重新加载表格
        function reloadgrid() {

            //查询参数直接添加在queryParams中
            var queryParams = $('#tt').datagrid('options').queryParams;
            getQueryParams(queryParams);
            $('#tt').datagrid('options').queryParams = queryParams;//传递值
            //alert(queryParams.Category);
            $("#tt").datagrid('reload');//重新加载table

        }

这里都是EasyUI封装好的数据显示区和检索功能区。注意事项：

1、table中的 url:'ExamineVerifyLog.ashx/ProcessRequest', 是要引用的一般处理程序
2、pageSize:5,pageList:[5,10,15,20]  是设置每页显示的数量
3、"field:'要绑定的数据  '用来绑定自己数据库对应的字段，其中的样式居中等可以自行设置。
4、查询传递参数，应该和工具栏区的控件ID名称 保持一致。

一般处理程序：

//声明B层类        userLogBLL userlog = new userLogBLL();
        public void ProcessRequest(HttpContext context)
        {
            string command = context.Request.QueryString["test"];

            if (command == null)
            {
                Query(context);
            }

            if (command == "modify")
            {
                Modify(context);
            }
            else
            {
                Query(context);
            }
        }

        //查询显示该页面下面的信息
        public void Query(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            //===============================================================
            //获取查询条件:【用户id,开始时间，结束时间，关键字】
            string category, startTime, endTime;
            category = startTime = endTime = "";
            if (null != context.Request.QueryString["Category"])
            {
                category = context.Request.QueryString["Category"].ToString().Trim();
            }
            if (null != context.Request.QueryString["StartTime"])
            {
                startTime = context.Request.QueryString["StartTime"].ToString().Trim();
            }
            if (null != context.Request.QueryString["EndTime"])
            {
                endTime = context.Request.QueryString["EndTime"].ToString().Trim();
            }            

            //================================================================
            //获取分页和排序信息：页大小，页码，排序方式，排序字段
            int pageRows, page;
            pageRows = 10;
            page = 1;
            string order, sort, oderby; order = sort = oderby = "";
            if (null != context.Request.QueryString["rows"])
            {
                pageRows = int.Parse(context.Request.QueryString["rows"].ToString().Trim());

            }
            if (null != context.Request.QueryString["page"])
            {

                page = int.Parse(context.Request.QueryString["page"].ToString().Trim());

            }
            if (null != context.Request.QueryString["sort"])
            {
                order = context.Request.QueryString["sort"].ToString().Trim();

            }
            if (null != context.Request.QueryString["order"])
            {
                sort = context.Request.QueryString["order"].ToString().Trim();

            }

            //===================================================================
            //组合查询语句：条件+排序
            StringBuilder strWhere = new StringBuilder();

            if (category != "")
            {
                strWhere.AppendFormat(" ExamineSign= '{0}' and ", category);
            }
            if (startTime != "")
            {
                strWhere.AppendFormat(" PublishDate >= '{0}' and ", startTime);
            }
            if (endTime != "")
            {
                strWhere.AppendFormat(" PublishDate <= '{0}' and ", endTime);
            }

            //删除多余的and
            int startindex = strWhere.ToString().LastIndexOf("and");//获取最后一个and的位置
            if (startindex >= 0)
            {
                strWhere.Remove(startindex, 3);//删除多余的and关键字
            }
            if (sort != "" && order != "")
            {
                //strWhere.AppendFormat(" order by {0} {1}", sort, order);//添加排序
                oderby = order + " " + sort;
            }
            //DataSet ds = Bnotice.GetList(strWhere.ToString());  //调用不分页的getlist

            //调用分页的GetList方法
            DataSet ds = userlog.GetListByPage(strWhere.ToString(), oderby, (page - 1) * pageRows + 1, page * pageRows);
            int count = userlog.GetRecordCount(strWhere.ToString());
            string strJson = ToJson.Dataset2Json(ds, count);
            context.Response.Write(strJson);
            context.Response.End();
        }

修改更新认证：

Html代码：

        //修改管理员
        function modify(flag) {
            $('#fm').form('clear');
            var row = $('#tt').datagrid('getSelected');//获取选中行

            //定义更新所需要的参数，也就是数据库对应的字段，从页面表格中获取即可。
            var userid = row.UserID;
            var content = row.Content;
            var examinemessage = row.ExamineMessage;
            var publishdate = row.PublishDate;
            var realname = row.RealName;
            var title = row.Title;
            var userlogid = row.UserLogID;
            var examineSign=flag;           

            var xmlHttp = null;

            //创建Ajax核心对象.表示当前浏览器不是ie
            if (window.XMLHttpRequest) {
                xmlHttp = new XMLHttpRequest();
            } else if (window.ActiveXObject) {//IE浏览器
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }

            var url = "ExamineVerifyLog.ashx?test=modify&UserID=" + userid + "&Content=" + content + "&ExamineSign=" + examineSign + "&ExamineMessage=" + examinemessage + "&PublishDate=" + publishdate + "&RealName=" + realname + "&Title=" + title + "&UserLogID=" + userlogid;

            //设置请求方式为GET，url，异步提交
            xmlHttp.open("GET", url, true);

            xmlHttp.onreadystatechange = function () {
                //alert(xmlHttp.readyState);
                //判断是否执行完毕
                if (4 == xmlHttp.readyState) {
                    //若执行成功
                    if (200 == xmlHttp.status) {
                        //调用reload
                        $('#tt').datagrid('reload');
                    }
                    else {
                        alert("请求失败！错误代码：" + xmlHttp.status);
                    }
                }
            };
            //开启异步请求
            xmlHttp.send(null);
        }

一般处理程序代码：

        /// <summary>
        /// 修改记录
        /// </summary>
        /// <param name="context"></param>
        public void Modify(HttpContext context)
        {
		//声明实体类
	    Entity.userLogEntity entityuserlog = new Entity.userLogEntity();
            entityuserlog.UserID = context.Server.UrlDecode(context.Request.QueryString["UserID"]);
            entityuserlog.Content = context.Server.UrlDecode(context.Request.QueryString["Content"]);
            entityuserlog.ExamineMessage = context.Server.UrlDecode(context.Request.QueryString["ExamineMessage"]);
            entityuserlog.PublishDate = context.Server.UrlDecode(context.Request.QueryString["PublishDate"]);
            entityuserlog.Title = context.Server.UrlDecode(context.Request.QueryString["Title"]);
            entityuserlog.UserLogID = context.Server.UrlDecode(context.Request.QueryString["UserLogID"]);
            entityuserlog.ExamineSign = context.Server.UrlDecode(context.Request.QueryString["ExamineSign"]);

            try
            {
                if (userlog.Update(entityuserlog))//判断是否更新成功
                {
                    context.Response.Write("T");
                }
                else
                {
                    context.Response.Write("F");
                }
            }

            catch (Exception ex)
            {

            }
	}

当然，这里没有写出D层的方法，D层都是动软代码生成的，不是我们自己写的，生成好之后，直接调用东软代码生成的方法~~~

自己的感觉：

对于ＥasyUI，我的感觉就是：各种封装好的框架，要实现相应的功能，调用其封装好的方法即可。但是这句话说起来简单，真正的做到，却是让人那个什么隐隐生疼的赶脚~~~这里还是多亏了成龙师哥的帮助，^_~......

补充一句闲话：说话是一回事，交流是另一回事！