随笔 - 9  文章 - 2  评论 - 51 

B/S系统操作日志设计思路

 

  最近做的系统需要实现操作日志的功能,主要记录用户的 增,删,改的操作。自己想的方法笨点儿但能满足需求,待日后有更好的解决方法了再来优化了,不多说先上效果图。

一,效果图

1, 日志列表

   

2, 日志详细

  

二,设计思路

1, 页面加载完成后,利用JS 记录需要记录的值到 对应的隐藏域中。

2, 页面提交时利用JS    对表单内容进行比较,记录改动过的项目,并保存到隐藏域中,供后台调用。

3, 用存储过程对隐藏域中的值进行解析并保存到数据库中

三,实现步骤

1,   页面的上 控件的命名要有规则这样 做是为了方便JS遍历页面上的控件

   

2,JS代码

记录和比较表单的JS
///页面加载完后,遍历页面上需要记录的项目,赋值给相应的隐藏域
$(document).ready(function () {
    //找到页面中的文本框 并把文本框中的值 赋值给 相应的 隐藏域
    var inpus = $("input[type='text']");
    for (var i = 0; i < inpus.length; i++) {
        if ($("#HF" + inpus[i].id).length > 0) {
            $("#HF" + inpus[i].id).val(inpus[i].value);
        }
    }
});

//表单提交时 比较表单提交前后 值的变化,并记录下有改动的项目 存入 隐藏域中供后台调用
//隐藏域中保存的信息格式 为: 被改字段含义,原值,新值 每条记录以 $分隔
function MyFormSubmit(btnID) {
    //比较文本框
    var changeInputs = "";
    var newInputs = $("input[type='text']");
    for (var i = 0; i < newInputs.length; i++) {
        if ($("#HF" + newInputs[i].id).length > 0) { 
            if ($.trim(newInputs[i].value) != $.trim($("#HF" + newInputs[i].id).val())) {
                changeInputs += $("#lb" + newInputs[i].id).text() + "," + $("#HF" + newInputs[i].id).val() + "," + $.trim(newInputs[i].value) + "$";
            }
        }
    }
//将改动过的表单内容记录到隐藏域中
$("#HFChangeContents").val(changeInputs);

    //检测表单内容是否改动过 
    if ($("#HFChangeContents").val() == "") {
        alert('无改动!');
    }
    else { 
      //提交表单
        document.getElementById(btnID).click();
    }
});

到这里已经得到了需要记录的表单改动项目,剩下数据处理就简单了。
本文只提供个人的拙见,如有更好的实现方式,请不吝赐教。如需源码请 戳 http://download.csdn.net/detail/sidabbs/4347781

posted on 2012-06-01 17:13  justconnor  阅读(7294)  评论(25编辑  收藏