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

什么事都耐不住“磨”?!

比如一个让人很头疼的问题,对于项目中所用到的EasyUI框架就是一个很明显的感受。项目使用的EasyUI框架,自身封装好的样式使得开发者不用考虑具体的div和css样式了,但是却折腾的接手项目不久的我们。那谁说的,生命不息,折腾不止,今天也来折腾一下EasyUI的简单操作——对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层都是动软代码生成的,不是我们自己写的,生成好之后,直接调用东软代码生成的方法~~~

自己的感觉:

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

补充一句闲话:说话是一回事,交流是另一回事!

上一篇:在官网下载了最新版的PHP,解压后的安装包里为什么没有php5isapi.dll这个dll文件?


下一篇:DataAdapter与DataSet的使用