个人账本管理系统-Web篇

   {
            id: "menuadd",
            text: '新增',
            iconCls: 'icon-add'
        }

$('#menuadd .l-btn-left').attr('class', 'easyui-splitbutton').menubutton({ menu: '#mm1' });

   onLoadSuccess: function () {
            $('.datagrid-toolbar').append($('#searchTool'));
            $('#searchTool').show();
        }

   var newrow={
        RecordID:'',
        ConsumeDate:'',
        ConsumeAmount:'',
        Category:'',
        SubCategory: '',
        AccountTips: ''
    };
    grid.datagrid('insertRow', { index: 0, row: newrow });
    grid.datagrid('beginEdit', 0);

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>账本系统</title>
    <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" />
    <script type="text/javascript" src="easyui/jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js"></script>
    <script type="text/javascript" src="js/dateCore.js"></script>
    <script type="text/javascript" src="Default.js"></script>
</head>
<body class="easyui-layout" style="overflow-y: hidden" scroll="no">
    <div region="north" style="overflow: hidden; height: 25px; background: #D2E0F2;"
        border="false">
        <div style="height: 25px; margin-right: 10px; line-height: 25px; text-align: right;">
            我的简单记账系统</div>
    </div>
    <div region="center" split="true" style="overflow: hidden;">
        <div id="tabs" class="easyui-tabs" fit="true" border="false">
            <div title="账单明细" style="padding: 5px; overflow: hidden;">
                <div id="grid">
                </div>
            </div>
            <div title="账单统计" style="padding: 5px; overflow: hidden;">
                <div id="gridt">
                </div>
            </div>
        </div>
    </div>
    <div region="south" style="height: 20px; background: #D2E0F2;" border="false">
        <div style="text-align: center;">
            © Copyright 2011 <a href="http://Wwwl.80.Hk">sobne.cn</a> All Rights Reserved</div>
    </div>
    <div region="west" split="true" title="快捷面板" style="width: 200px; overflow: hidden;">
        <div style="margin: 8px;">
            <form id="ff" method="post">
            <div id="cld" name="cld" style="width:180px;height:180px;"></div>
            <div style=" margin-top:20px;">
                记账日期:<br />
                <input id="ConsumeDate" name="ConsumeDate" required="true"/>
            </div>
            <div>
                记账金额:<br />
                <input id="ConsumeAmount" name="ConsumeAmount" class="easyui-numberbox" min="1" type="text" style="width: 160px" required="true"/>
            </div>
            <div>
                记账大类:<br />
                <select id="Category" name="Category" class="easyui-combobox" style="width: 100px;" required="true">
                </select>
            </div>
            <div>
                记账小类:<br />
                <select id="SubCategory" name="SubCategory" class="easyui-combobox" style="width: 160px;" required="true">
                </select>
            </div>
            <div>
                记账描述:<br />
                <textarea id="AccountTips" name="AccountTips" style="height: 60px;width:160px;"></textarea>
            </div>
            <div style=" margin-top:10px;background:#efefef;width:166px; text-align:right">
                <a id="btnupdate" href="javascript:saveAccount();" iconCls="icon-save" class="easyui-linkbutton" plain="true">修改</a>
                <a id="btnadd" href="javascript:addAccount();" iconCls="icon-add" class="easyui-linkbutton" plain="true">添加</a>
            </div>
            </form>
        </div>
    </div>
    <div region="east" split="true" title="条件过滤" style="width: 200px; overflow: hidden;">
        <div style="margin: 8px">
            <div>
                <div id="cld1" name="cld1" style="width:180px;height:180px;"></div>
                <br /><div id="cld2" name="cld2" style="width:180px;height:180px;"></div>
                <input id="txtcld1" type="hidden"/>
                <input id="txtcld2" type="hidden"/>
            </div>
            <div style=" margin-top:5px; display:none">
                <br />记账大类:<br />
                <select id="CategoryFilter" name="CategoryFilter" class="easyui-combobox" style="width: 120px;">
                </select>
                <br />记账小类:<br />
                <select id="SubCategoryFilter" name="SubCategoryFilter" class="easyui-combobox" style="width: 180px;">
                </select>
            </div>
        </div>
    </div>

    <div id="search-window" title="查询窗口" style="width: 350px; height: 200px;">
        <div style="padding: 20px">
            <div style=" margin-top:10px;">
                记账日期:
                <input id="date1" name="date1" class="easyui-datebox" style="width: 100px;"/>
                -
                <input id="date2" name="date2" class="easyui-datebox" style="width: 100px;"/>
            </div>
            <div style=" margin-top:10px;">
                记账类型:
                <select id="cg" name="cg" class="easyui-combobox" style="width: 200px;">
                </select>
            </div>
        </div>
        <div style="text-align: center; padding: 5px;">
            <a href="javascript:void(0)" onclick="SearchOK()" id="btn-search" icon="icon-ok">确定</a>
            <a href="javascript:void(0)" onclick="closeSearchWindow()" id="btn-search-cancel" icon="icon-cancel">关闭</a>
        </div>
    </div>
    <div id="Dlg-Edit" title="编辑窗口" style="width: 300px; height: 330px;">
        <div style="padding: 20px">
            <form method="post">
                <div style=" margin-top:10px;">
                    记账日期:
                    <input id="Text1" name="ConsumeDate" class="easyui-datebox" required="true"/>
                </div>
                <div>
                    记账金额:
                    <input id="Text2" name="ConsumeAmount" class="easyui-numberbox" min="1" type="text" style="width: 160px" required="true"/>
                </div>
                <div>
                    记账大类:
                    <select id="dlg_Category" name="Category" class="easyui-combobox" style="width: 100px;" required="true">
                    </select>
                </div>
                <div>
                    记账小类:
                    <select id="dlg_SubCategory" name="SubCategory" class="easyui-combobox" style="width: 160px;" required="true">
                    </select>
                </div>
                <div>
                    记账描述:</br>
                    <textarea id="Textarea1" name="AccountTips" style="height: 80px;width:220px;"></textarea>
                </div>
            </form>
        </div>
    </div>
    <span id="searchTool" style="display: none;">
        搜索:<input type="text" id="txtSearch" title="请输入关键字" onkeydown="if(event.keyCode==13) toolSearch();"/><a href="javascript:toolSearch();" iconcls="icon-search" class="easyui-linkbutton" plain="true"></a>
    </span>
    <div id="mm1" style="width:150px;">
        <div onclick="addrow()">表格内</div>
        <div onclick="add()">弹出窗口</div>
    </div>
</body>
</html>

});

//#region dialog

using System;
using System.Web;
using System.Data;
using System.Text;
using System.Collections.Generic;
using Utility4Net;
using Utility4Net.Web;
using Utility4Net.Web.Object;

public class AccountBook : IHttpHandler
{
    private string connectString = string.Empty;
    public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "text/plain";
        string sReturnJson = string.Empty;
        string action =RequestAccessor.Request("action");
        switch (action)
        {
            case "default":
            case "get":
            case "filter":
            case "hightsearch":
            case "query":
                sReturnJson = getData(action);
                break;
            case "getsingle":
                sReturnJson = getSingleData();
                break;
            case "getCategory":
                sReturnJson = getCategory();
                break;
            case "getsubCategory":
                sReturnJson = getsubCategory();
                break;
            case "save":
                sReturnJson = saveData();
                break;
            case "saveinline":
                sReturnJson = saveinlineData();
                break;
            case "save4phone":
                sReturnJson = saveData4Phone();
                break;
            case "del":
                sReturnJson = delete();
                break;
            default:
                break;
        }
        context.Response.Write(sReturnJson);
    }
    private string delete()
    {
        string sReturnJson = string.Empty;
        string id = RequestAccessor.QueryString("id");
        if (Account.Instance.deleteAccount(id))
            sReturnJson = "{success:true}";
        else
            sReturnJson = "{success:false}";
        return sReturnJson;
    }
    private string saveData4Phone()
    {
        string sReturnJson = string.Empty;
        string id = RequestAccessor.QueryString("id");
        string AccountTips = RequestAccessor.QueryString("AccountTips");
        string Category = RequestAccessor.QueryString("Category");
        string SubCategory = RequestAccessor.QueryString("SubCategory");
        string ConsumeAmount = RequestAccessor.QueryString("ConsumeAmount");
        string ConsumeDate = RequestAccessor.QueryString("ConsumeDate");
        ConsumeDate = DateTime.Parse(ConsumeDate).ToString("yyyy-MM-dd");
        AccountModel mode = new AccountModel();
        mode.AccountTips = AccountTips;
        mode.Category = Category;
        mode.SubCategory = SubCategory;
        mode.ConsumeAmount = Decimal.Parse(ConsumeAmount);
        mode.ConsumeDate = ConsumeDate;
        if (id.Length > 0)
        {
            mode.RecordID = int.Parse(id);
            if (Account.Instance.updateAccount(mode))
                sReturnJson = "{success:true}";
            else
                sReturnJson = "{success:false,msg:'保存信息失败'}";
        }
        else
        {
            if (Account.Instance.insertAccount(mode))
                sReturnJson = "{success:true}";
            else
                sReturnJson = "{success:false,msg:'保存信息失败'}";
        }
        return sReturnJson;
    }
    private string saveinlineData()
    {
        string sReturnJson = string.Empty;
        string id = RequestAccessor.Request("RecordID");
        string AccountTips = RequestAccessor.Request("AccountTips");
        string Category = RequestAccessor.Request("Category");
        string SubCategory = RequestAccessor.Request("SubCategory");
        string ConsumeAmount = RequestAccessor.Request("ConsumeAmount");
        string ConsumeDate = RequestAccessor.Request("ConsumeDate");
        ConsumeDate = DateTime.Parse(ConsumeDate).ToString("yyyy-MM-dd");
        AccountModel mode = new AccountModel();
        mode.AccountTips = AccountTips;
        mode.Category = Category;
        mode.SubCategory = SubCategory;
        mode.ConsumeAmount = Decimal.Parse(ConsumeAmount);
        mode.ConsumeDate = ConsumeDate;
        if (id.Length > 0)
        {
            mode.RecordID = int.Parse(id);
            if (Account.Instance.updateAccount(mode))
                sReturnJson = "{success:true}";
            else
                sReturnJson = "{success:false,msg:'保存信息失败'}";
        }
        else
        {
            if (Account.Instance.insertAccount(mode))
                sReturnJson = "{success:true}";
            else
                sReturnJson = "{success:false,msg:'保存信息失败'}";
        }
        return sReturnJson;
    }
    private string saveData()
    {
        string sReturnJson = string.Empty;
        string id = RequestAccessor.QueryString("id");
        string AccountTips =RequestAccessor.RequestForm("AccountTips");
        string Category = RequestAccessor.RequestForm("Category");
        string SubCategory = RequestAccessor.RequestForm("SubCategory");
        string ConsumeAmount = RequestAccessor.RequestForm("ConsumeAmount");
        string ConsumeDate = RequestAccessor.RequestForm("ConsumeDate");
        ConsumeDate = DateTime.Parse(ConsumeDate).ToString("yyyy-MM-dd");
        AccountModel mode = new AccountModel();
        mode.AccountTips = AccountTips;
        mode.Category = Category;
        mode.SubCategory = SubCategory;
        mode.ConsumeAmount = Decimal.Parse(ConsumeAmount);
        mode.ConsumeDate = ConsumeDate;
        if (id.Length > 0)
        {
            mode.RecordID = int.Parse(id);
            if (Account.Instance.updateAccount(mode))
                sReturnJson = "{success:true}";
            else
                sReturnJson = "{success:false,msg:'保存信息失败'}";
        }
        else
        {
            if (Account.Instance.insertAccount(mode))
                sReturnJson = "{success:true}";
            else
                sReturnJson = "{success:false,msg:'保存信息失败'}";
        }
        return sReturnJson;
    }
    private string getsubCategory()
    {
        StringBuilder sb = new StringBuilder();
        DataTable dt = Account.Instance.getsubCategory(RequestAccessor.Request("Category"));
        return JsonHelper.toJson(dt);
    }
    private string getCategory()
    {
        StringBuilder sb = new StringBuilder();
        DataTable dt = Account.Instance.getCategory();
        return JsonHelper.toJson(dt);
    }
    private string getSingleData()
    {
        string id = RequestAccessor.QueryString("id");
        DataTable dt = Account.Instance.getSingleAccount(id);
        return JsonHelper.toJson(dt,dt.Rows[0]);
    }
    private string getData(string action)
    {
        string order =easyUI.Params.order;
        string sort = easyUI.Params.sort;
        string sWhere = string.Empty;
        switch (action)
        {
            case "get":
                string date = RequestAccessor.Request("date");
                if (!string.IsNullOrEmpty(date))
                    sWhere = " where ConsumeDate='" + date + "'";
                break;
            case "filter":
                sWhere = " where 1=1 ";
                string date1 = RequestAccessor.Request("date1");
                string date2 = RequestAccessor.Request("date2");
                if (!string.IsNullOrEmpty(date1))
                    sWhere += " and ConsumeDate >='" + date1 + "'";
                if (!string.IsNullOrEmpty(date2))
                    sWhere += " and ConsumeDate <='" + date2 + "'";
                break;
            case "hightsearch":
                sWhere = " where 1=1 ";
                string hdate1 = RequestAccessor.Request("date1");
                string hdate2 = RequestAccessor.Request("date2");
                string hcg = RequestAccessor.Request("cg");
                if (!string.IsNullOrEmpty(hdate1))
                    sWhere += " and ConsumeDate >='" + hdate1 + "'";
                if (!string.IsNullOrEmpty(hdate2))
                    sWhere += " and ConsumeDate <='" + hdate2 + "'";
                if (!string.IsNullOrEmpty(hcg))
                    sWhere += " and SubCategory ='" + hcg + "'";
                break;
            case "default":
                string dateMonth = System.DateTime.Now.ToString("yyyy-MM");
                sWhere = " where ConsumeDate like'" + dateMonth + "%'";
                break;
            case "query":
                sWhere = " where 1=1 ";
                string cg = RequestAccessor.Request("cg");
                string search = RequestAccessor.Request("search");
                if (!string.IsNullOrEmpty(search))
                    sWhere += " and (Category like '%" + search + "%' or SubCategory like '%" + search + "%')";
                if (!string.IsNullOrEmpty(cg))
                    sWhere += " and Category like '%" + cg + "%'";
                break;
            default:
                break;
        }
        string type = RequestAccessor.QueryString("type");
        DataTable dt;
        if (type=="sum")
            dt = Account.Instance.getAccount(sWhere);
        else
            dt = Account.Instance.getAccount(sWhere, order, sort);
        string gridjson = "";
        double dtotal=0;
        foreach (DataRow dr in dt.Rows)
        {
            dtotal = dtotal + double.Parse(dr["ConsumeAmount"].ToString());
        }
        Dictionary<string, string> footer = new Dictionary<string, string>();
        footer.Add("Category", "合计:");
        footer.Add("ConsumeAmount", dtotal.ToString());
        StringBuilder fItems = new StringBuilder();
        fItems.Append("[");
        fItems.Append(JsonHelper.Serialize<Dictionary<string, string>>(footer));
        fItems.Append("]");
        gridjson = easyUI.Json.datagrid(dt,footer: fItems.ToString());
        return gridjson;
    }
    public bool IsReusable {
        get {
            return false;
        }
    }
}

undefined™'s cnblogs

写自己的博,让别人点击去吧

1.DataGrid的Toolbar

1.1 MenuButton in Toolbar

1.2 search panel in Toolbar

2.表单相关

附1 html：

附2 js：(太长,分成两部分)

附3 ashx处理页面

公告