在最近做的《教务-基础系统》中有这样一个功能:为了防止用户误删数据,或者将数据删除后还想恢复,我们对数据的处理不是直接删除,而是允许用户撤销数据,如果用户想使用撤销的数据激活一下即可。这里说一下我撤销操作的实现,作为初学者,我说的可能有很多不到位的地方,还请高手指点!
一、先看一下,课程类型撤销运行效果
由于此处我上传的gif图片不动,我将《课程类型撤销展示》上传空间了。
二、然后说一下这部分使用的技术及插件
1.这里我采用的是jbox插件,这个插件刚刚接触,感觉它的效果还是不错的。
2.撤销部分我采用ajax技术,利用一般处理程序将撤销的数据更新至数据库。
三、最后介绍一下我制作过程及代码的编写
1.准备工作
因为使用jBox插件,于是首先需要导入jBox文件夹,在页面头部引入jBox CSS文件及js文件;在页面撤销后数据库数据也进行撤销,这里的操作使用一般处理程序处理,于是用到handler文件夹。
2.页面头部引用各css文件及js文件,并编写用到的函数
撤销操作需要用到的函数
<!--撤销课程类型弹出框jBox-->
<script type="text/javascript">
// 调父窗口请用 parent 或 top,如果是多层iframe,需要调用多个parent
var html = "<div style='padding:10px;'>输入撤销原因:<input type='text' id='courseTypeID' name='CourseType' /></div>";
var submit = function (v, h, f) {
if (f.courseTypeID == '') {
// f.some 或 h.find('#some').val() 等于 top.$('#some').val()
$.jBox.tip("请输入撤销原因。", 'error', { focusId: "courseTypeID" }); // 关闭设置 some 为焦点
return false;
}
//显示你输入的原因
// top.$.jBox.info("撤销原因:" + f.some);
//撤销课程类型,通过ajax基础,执行一般处理程序
$.ajax({
// type: 'post',
url: '../handler/DeleteCourseTypeByID.ashx',
data: "data=" + escape(f.CourseType) + "&CourseTypeID=" + $("#hidd_valCrourseTypeId").val() + "&rnd=" + Math.random(),
// dataType: 'text',
dataType:'html',
success: function (mgs) {
alert(mgs);
if (Number(mgs) > 0) {
if (document.getElementById("t_" + $("#hidd_valCrourseTypeId").val()))
$("#t_" + $("#hidd_valCrourseTypeId").val()).html("");
} else { alert("撤销失败!"); }
}, error: function () {
location.href = location.href;
}
})
return true;
};
//top.$.jBox(html, { title: "撤销原因", submit: submit });
//根据课程类型ID撤销课程类型信息
function CancelCourseTypeById(CourseTypeID) { $("#hidd_valCrourseTypeId").val(CourseTypeID); top.$.jBox(html, { title: "撤销原因", submit: submit }); }
// }
</script>
3.撤销按钮事件(使用隐藏控件保存课程类型ID)
<!--隐藏控件,保存课程类型ID-->
<input type="hidden" value="" id="hidd_valCrourseTypeId" />
<!--撤销按钮,撤销课程类型事件-->
<td class="icon tail" width="100px">
<a class="opt" title="撤销" href="javascript:CancelCourseTypeById('<%#Eval("CourseTypeID")%>')"><span class="icon-cancel">
</span></a>
</td>
4.一般处理程序(DeleteCourseTypeByID.ashx),与页面头部ajax操作处使用的一般处理程序名称相对应
<%@ WebHandler Language="C#" Class="DeleteCourseTypeByID" %>
/*
* 创建人:马兆娟
* 创建时间:2013年1月14日15:40:10
* 版权所有:提高班
* 此模块作用:撤销课程类型信息
*/
using System;
using System.Web;
//引用命名空间及BLL层和实体层
using System.Data;
//引用课程BLL层
using TeachSystem.BLL.CourseBLL;
//引用课程实体层
using TeachSystem.Entity.CourseEntity;
public class DeleteCourseTypeByID : IHttpHandler {
public void ProcessRequest(HttpContext context)
{
//context.Response.ContentType = "text/plain";
string strData = "";
string strCourseTypeID = "";
//撤销理由
strData = context.Request.QueryString["data"];
//课程类型ID
strCourseTypeID = context.Request.QueryString["CourseTypeID"];
/*
* 数据处理类
*
* */
//课程类型ID
//string strCourseTypeID = context.Request.QueryString["strCourseTypeID"];
//课程类型实体
CourseTypeEntity enCourseType = new CourseTypeEntity();
enCourseType.CourseTypeID = strCourseTypeID;
enCourseType.ActionReason = strData;
//操作人
enCourseType.OperatorName = "zhang";
//调用BLL层方法,根据课程类型ID撤销课程类型信息
Boolean boolDeleteCourseType = new CourseTypeBLL().CancelCourseType(enCourseType);
if (true == boolDeleteCourseType)
{
//成功,弹出1;失败,弹出0
context.Response.Write("1");
}
else
{
context.Response.Write("0");
}
}
}
至此撤销操作就完成了,当然这样执行起来依然有瑕疵,需要我们探索改进。