`
zrj_software
  • 浏览: 202166 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

jQuery EasyUI之datagrid

JavascriptEasy-UIdatagrid 
阅读更多

1.

<table id="mTab" iconcls="icon-edit" singleSelect="true" idField="Item04" title="EasyUI-Grid" \>
<thead><tr>
<th field="Item03" width="30" align="center">序号</th>
<th field="Item04" width="500" editor="text">工作任务</th>
<th field="Item05" width="100" align="right" formatter="JoinFormatter" editor="{type:'combobox',options:{valueField:'sValue',textField:'name',data:_Join,editable:false}}">协办</th>"
<th field="Item06" width="90" align="right" editor="datebox">日期</th>
<th field="Item07" width="75" formatter="LeaderFormatter" editor="{type:'combobox',options:{valueField:'sValue',textField:'name',data:_Leader,editable:false}}">领导</th>"
<th field="Item08" width="60" align="center">报告</th>
</tr></thead></table>

 2.Creat Table-JS

    function CreatTable(t) {
        var $t = $('#mTab');
        var lastIndex;
        $t.datagrid({
            width: 900,
            height: 320,
            fitColumns: false,
            nowrap: false,
            collapsible: true,
            collapsed: false,
            frozenColumns: [[
	                { field: 'ck', checkbox: true }
				]],
            pagination: true,
            toolbar: [{
                text: '新增',
                iconCls: 'icon-add',
                handler: function () {
                    $t.datagrid('endEdit', lastIndex);
                    var CurIndex = $t.datagrid('getRows').length+1;
                    $t.datagrid('appendRow', {
                        Item03: CurIndex,
                        Item04: '',
                        Item05: '',
                        Item06: '',
                        Item07: ''
                    });
                    lastIndex = $t.datagrid('getRows').length - 1;
                    $t.datagrid('selectRow', lastIndex);
                    $t.datagrid('beginEdit', lastIndex);
                }
            }, '-', {
                text: '删除',
                iconCls: 'icon-remove',
                handler: function () {
                    if (confirm("确定删除吗？")) {
                        var row = $t.datagrid('getSelected');
                        if (row) {
                            var index = $t.datagrid('getRowIndex', row);
                            $t.datagrid('deleteRow', index);
                            btnOnDel(_id, t, row.Item03);
                        }
                    }
                    else {
                    }
                }
            }, '-', {
                text: '保存草稿',
                iconCls: 'icon-save',
                handler: function () {
                    var rowData = $t.datagrid('getSelected');
                    $t.datagrid('acceptChanges');
                    btnOnSave(_id, t, rowData);
                }
            }],
            onBeforeLoad: function () {
                $(this).datagrid('rejectChanges');
            },
            onDblClickRow: function (rowIndex) {
                if (lastIndex != rowIndex) {
                    $t.datagrid('endEdit', lastIndex);
                    $t.datagrid('beginEdit', rowIndex);
                }
                lastIndex = rowIndex;
            },
            onAfterEdit: function (rowIndex, rowData, changes) {//编辑完触发
                btnOnSave(_id, t, rowData);
            }
        });

        var p = $t.datagrid('getPager');//分页
        $(p).pagination({
            total: 0,
            pageList: [8, 15, 30, 50, 200],
            onBeforeRefresh: function () {
            },
            onSelectPage: function (pageNumber, pageSize) {//分页触发
                GetWorkListByDep(t, _id, pageNumber - 1, pageSize);
            }
        });
    }

 

3.Load Data

function GetWorkListByDep(t,id, pageNumber, pageSize) {
        var $t = $('#mTab');
      
        Ajax_Work.GetWorkListByDep(id, t, pageNumber, pageSize, GetWorkListByDep_CallBack);
        function GetWorkListByDep_CallBack(response) {
            EZWaitBox.hide();
            var obj = jQuery.parseJSON(response.value);
            if (obj.returnValue == 0) {
                $t.datagrid('loadData', obj);
            }
            else {
                alert(obj.error);
            }
        }
    }

 

4.Save Data

 function btnOnSave(id,t,rowData) {
        Ajax_Work.UpdatePWokM002(id, t, JSON.stringify(rowData), UpdatePWokM002_Back);
        function UpdatePWokM002_Back(ret){
        }
    }

 

5.Delete Data

 function btnOnDel(id,t,sno) {
        Ajax_Work.DeletedatePWokM002(id, t, sno);
    }

 

6.DropDownList Binding

 var _Leader = [];
    function LeaderFormatter(value) {
        for (var i = 0; i < _Leader.length; i++) {
            if (_Leader[i].sValue == value) return _Leader[i].name;
        }
        return value;
    }

    var _Join=[];
     function JoinFormatter(value) {
        for (var i = 0; i < _Join.length; i++) {
            if (_Join[i].sValue == value) return _Join[i].name;
        }
        return value;
    }

 

7.cs

[Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
        public static string GetWorkListByDep(string id, string sNode, string pageNumber, string pageSize)//id-计划ID sNode-责任主体
        {
            try
            {
                int PageSize = 8;
                int nPageIndex = 0;
                if (pageNumber != "")
                {
                    nPageIndex = Lanall.EasyConvert.ToInt32(pageNumber);
                }

                if (pageSize != "")
                {
                    PageSize = Lanall.EasyConvert.ToInt32(pageSize);
                }

                Lanall.Data.AccessQuery query = new Lanall.Data.AccessQuery();
                query.maxRecords = PageSize;
                query.startRecord = PageSize * nPageIndex;

                AjaxPro.JavaScriptArray dataItems = new JavaScriptArray();

                string sFilter = " Item01="+Lanall.EasySQL.QuotedString(id)
                    + " AND  Item02=" + Lanall.EasySQL.QuotedString(sNode);

                sFilter = "";
                string sOrder = " Item03  ";
                PWokM002Data data = PWokM002System.GetPWokM002Data(CSContext.Current.User.Comp, sFilter, sOrder, query);

                int itotal = query.TotalRecords;
                foreach (DataRow row in data.Tables[PWokM002Data.TABLE_PWokM002].Rows)
                {
                    string dTime = "";
                    if (row["Item06"].ToString() != "")
                    {
                        dTime = Convert.ToDateTime(row["Item06"].ToString()).ToString("yyyy-MM-dd");
                    }

                    string sItem08 = string.Format("<a href=\"javascript:void(0);\" onClick=\"btnItem08('{0}','{1}','{2}')\"> 设置</a>",
                        id, sNode, row["Item03"].ToString());
                    JavaScriptObject dataItem = new JavaScriptObject();

                    dataItem.Add("Item03", new JavaScriptString(row["Item03"].ToString()));
                    dataItem.Add("Item04", new JavaScriptString(row["Item04"].ToString()));
                    dataItem.Add("Item05", new JavaScriptString(row["Item05_Caption"].ToString()));
                    dataItem.Add("Item06", new JavaScriptString(dTime));
                    dataItem.Add("Item07", new JavaScriptString(row["Item07_Caption"].ToString()));
                    dataItem.Add("Item08", new JavaScriptString(sItem08));
                    dataItems.Add(dataItem);
                }

                if (query.TotalRecords < PageSize)
                {
                    itotal = PageSize;
                    for (int i = data.Tables[PWokM002Data.TABLE_PWokM002].Rows.Count; i < PageSize; i++)
                    {
                        string sItem08 = string.Format("<a href=\"javascript:void(0);\" onClick=\"btnItem08('{0}','{1}','{2}')\"> 设置</a>",
                        id, sNode, (i+1).ToString());
                        JavaScriptObject dataItem = new JavaScriptObject();
                        dataItem.Add("Item03", new JavaScriptNumber(i + 1));
                        dataItem.Add("Item04", new JavaScriptString(""));
                        dataItem.Add("Item05", new JavaScriptString(""));
                        dataItem.Add("Item06", new JavaScriptString(""));
                        dataItem.Add("Item07", new JavaScriptString(""));
                        dataItem.Add("Item08", new JavaScriptString(sItem08));
                        dataItems.Add(dataItem);
                    }
                }

                JavaScriptObject jdataReturn = new JavaScriptObject();
                jdataReturn.Add("returnValue", new JavaScriptNumber(0));
                jdataReturn.Add("total", new JavaScriptNumber(itotal));
                jdataReturn.Add("rows", dataItems);

                StringBuilder ss = new StringBuilder();
                AjaxPro.JavaScriptSerializer.Serialize(jdataReturn, ss);
                return ss.ToString();
            }
            catch (Exception e)
            {
                JavaScriptObject jdataReturn = new JavaScriptObject();
                jdataReturn.Add("returnValue", new JavaScriptNumber(1));
                jdataReturn.Add("error", new JavaScriptString(e.Message));
                StringBuilder ss = new StringBuilder();
                AjaxPro.JavaScriptSerializer.Serialize(jdataReturn, ss);
                return ss.ToString();
            }

        }

        [Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
        public void UpdatePWokM002(string id, string DepID, string sPostData)
        {
            string sItem03 = "";
            string sItem04 = "";
            string sItem05 = "";
            string sItem06 = "";
            string sItem07 = "";

            AjaxPro.JavaScriptObject PostData;
            PostData = (AjaxPro.JavaScriptObject)AjaxPro.JavaScriptDeserializer.DeserializeFromJson(sPostData, typeof(AjaxPro.JavaScriptObject));
            if (PostData != null)
            {
                sItem03 = PostData["Item03"].Value.ToString().Replace("\"", "");
                sItem04 = PostData["Item04"].Value.ToString().Replace("\"", "");
                sItem05 = PostData["Item05"].Value.ToString().Replace("\"", "");
                sItem06 = PostData["Item06"].Value.ToString().Replace("\"", "");
                sItem07 = PostData["Item07"].Value.ToString().Replace("\"", "");
            }

            string sFilter = " Item01=" + Lanall.EasySQL.QuotedString(id)
                + " AND Item02=" + Lanall.EasySQL.QuotedString(DepID)
                + " AND Item03=" + Lanall.EasySQL.QuotedString(sItem03);
            PWokM002Data data = PWokM002System.GetPWokM002Data(CSContext.Current.User.Comp, sFilter, "", null);
            if (data.Tables[PWokM002Data.TABLE_PWokM002].Rows.Count > 0)
            {
                DataRow row = data.Tables[PWokM002Data.TABLE_PWokM002].Rows[0];
                row[PWokM002Data.FIELD_Item04] = sItem04;
                row[PWokM002Data.FIELD_Item05] = sItem05;
                if (sItem06 != "")
                    row[PWokM002Data.FIELD_Item06] = sItem06;
                else
                    row[PWokM002Data.FIELD_Item06] = System.DBNull.Value;
                row[PWokM002Data.FIELD_Item07] = sItem07;
                PWokM002System.UpdatePWokM002Data(CSContext.Current.User.Comp,data);
            }
            else
            {
                DataRow row = data.Tables[PWokM002Data.TABLE_PWokM002].NewRow();
                row[PWokM002Data.FIELD_Item00] = CSContext.Current.User.Comp.CompID;
                row[PWokM002Data.FIELD_Item01] = id;
                row[PWokM002Data.FIELD_Item02] = DepID;
                row[PWokM002Data.FIELD_Item03] = sItem03;
                row[PWokM002Data.FIELD_Item04] = sItem04;
                row[PWokM002Data.FIELD_Item05] = sItem05;
                if (sItem06 != "")
                    row[PWokM002Data.FIELD_Item06] = sItem06;
                else
                    row[PWokM002Data.FIELD_Item06] = System.DBNull.Value;
                row[PWokM002Data.FIELD_Item07] = sItem07;
                data.Tables[PWokM002Data.TABLE_PWokM002].Rows.InsertAt(row, 0);
                PWokM002System.UpdatePWokM002Data(CSContext.Current.User.Comp, data);
            }
        }

        [Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
        public void DeletedatePWokM002(string id, string DepID, string sNo)
        {
            string sFilter = " Item01=" + Lanall.EasySQL.QuotedString(id)
                + " AND Item02=" + Lanall.EasySQL.QuotedString(DepID)
                + " AND Item03=" + Lanall.EasySQL.QuotedString(sNo);
            PWokM002System.DeletePWokM002ByID(CSContext.Current.User.Comp, sFilter);
        }

 

8.End.

 

分享到：
| SQL Server 大数据量数据存储设计思路分享 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    jquery easyui datagrid demo

    这个“jquery easyui datagrid demo”包含了一些关于如何使用 jQuery EasyUI 中 Datagrid 组件的示例和相关文档，帮助我们理解和应用 Datagrid。 首先，`datagrid.doc` 文件很可能是 Datagrid 的简要说明文档，它...

    jQuery EasyUI编辑DataGrid用combobox实现多级联动

    在jQuery EasyUI中，DataGrid是一种常用的表格展示控件，它可以与各种编辑器结合使用，如combobox（下拉框）来实现更丰富的交互功能。本文主要探讨的是如何利用jQuery EasyUI的DataGrid和combobox组件实现多级联动的...

    扩展 jQuery EasyUI Datagrid 数据行鼠标悬停离开事件完整版Demo下载

    jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像（onMouseOver/onMouseOut） Demo 扩展 jQuery EasyUI Datagrid 数据行鼠标悬停离开事件，源码奉献！！！

    jquery.easyui.datagrid扩展合并列

    jquery.easyui.datagrid自动合并列扩展，支持多列合并。 用法：加载成功后 $('#'+tab).datagrid("autoMergeCells",['列名','列名']);

    Easyui-DataGrid表头拖动效果

    UI设计在一个系统中的重要性是不容忽视的，我们开发人员要做到：让用户去控制...给你的Easyui-DataGrid 表头添加一点料吧 Easyui-Datagrid—表头灵活显示http://blog.csdn.net/u010293698/article/details/47956865

    详解jquery easyui之datagrid使用参考

    本文介绍了jquery easyui之datagrid使用，具体如下： 创建datagrid 在页面上添加一个div或table标签，然后用jquery获取这个标签，并初始化一个datagrid。代码如下： 页面上的div标签： js代码： $('#...

    easyui的datagrid生成合并行,合计计算价格

    在IT行业中，EasyUI是一个基于JavaScript和jQuery的前端框架，它提供了一系列的UI组件，用于构建用户界面。在描述中提到的"easyui的datagrid生成合并行,合计计算价格"，指的是如何使用EasyUI的DataGrid组件来实现...

    easyui datagrid 数据导出到Excel

    在IT行业中，EasyUI Datagrid是一款基于jQuery的前端数据展示组件，它提供了丰富的表格功能，如排序、分页、过滤等。在实际工作中，我们经常需要将这些展示的数据导出到Excel文件，以便进行进一步的分析或存储。下面...

    JqueryEasyUI DataGrid例子

    综上所述，这个 JqueryEasyUI DataGrid 示例展示了如何使用前端框架与后端服务器配合，实现一个功能完备的表格应用。在实际开发中，开发者可以根据需求调整 DataGrid 的配置项，以及后台 Servlet 的逻辑，以适应各种...

    easyui datagrid 动态隐藏显示列

    jquery easyui 扩展 datagrid 自定义动态隐藏显示列

    jquery easyui datagrid性能优化

    jquery easyui datagrid 性能优化，优化后可快速提升查询性能。唯一的缺陷就是不支持可编辑grid了。只需要在引入easyui.js后面引入此js即可。

    easyui datagrid 增加鼠标悬停弹窗事件

    在IT领域，EasyUI是一个基于JavaScript和jQuery的前端框架，它为开发者提供了丰富的组件和样式，使得构建用户界面变得更加便捷。在本示例中，我们关注的是如何在EasyUI的Datagrid组件上添加一个特殊功能：当鼠标悬停...

    EasyUI的DataGrid显示ASP.NET内容

    EasyUI的DataGrid是一款基于jQuery的轻量级前端数据展示组件，它被广泛应用于Web应用中，用于展示和操作结构化的数据。在结合ASP.NET框架时，DataGrid能有效地将服务器端的数据动态地呈现到客户端，提供排序、分页、...

    jquery easyui 表头固定 datagrid 弹出框 AJAX刷新页面

    1. **jQuery EasyUI Datagrid**: Datagrid是EasyUI的核心组件之一，它用于展示结构化的表格数据。它支持排序、分页、筛选等功能，并且可以方便地与后台数据库进行交互。在这个场景中，开发者可能需要一个具有固定...

    在jquery easyui中的datagrid中添加searchbox!

    在jQuery EasyUI中，`datagrid`是一个非常常用的组件，它用于展示数据表格，具有丰富的功能和良好的用户体验。而`searchbox`则是为了增强`datagrid`的搜索功能，让用户能够更方便地查找表格中的特定数据。在标题和...

    jquery-easyui-datagrid

    **jQuery EasyUI Datagrid 插件详解** jQuery EasyUI 是一套基于 jQuery 的用户界面插件集合，它使得开发者能够快速构建具有专业外观和交互性的 Web 应用程序。`datagrid` 是其中的一个重要组件，主要用于展示表格...

    easyui-datagrid之间拖拽效果demo

    在前端开发中，EasyUI 是一个基于 jQuery 的 UI 框架，它提供了一系列易于使用的组件，如对话框、表单、菜单、树形结构等，帮助开发者快速构建用户界面。"easyui-datagrid 之间拖拽效果 demo" 重点展示了如何在两个 ...

    jquery easyui 帮助文档

    jQuery EasyUI 的核心在于其组件系统，这些组件包括但不限于数据网格（datagrid）、下拉菜单（combobox）、对话框（dialog）、表单（form）、布局（layout）、菜单（menu）、面板（panel）、进度条（progressbar）、...

Magicbox
Global site tag (gtag.js) - Google Analytics