关于Easyui 可编辑的数据表格中的计算

来源:互联网 发布:网络暴力议论文 编辑:程序博客网 时间:2024/05/17 03:13

最近项目中遇到的问题,在网上找了很多资料,现在也把我遇到的问题和解决方案存下来



代码如下:

html:

  <table id="dk"></table>


JS:

  $("#dk").datagrid('endEdit', editRow);
                var rows = $("#dk").datagrid('getChanges');


            var $dk = $('#dk');
            var editRow = undefined;
            $("#dk").datagrid({
                onClickRow: function (rowIndex, rowData) {
                    $(this).datagrid('unselectRow', rowIndex);
                },
                columns: [[
                     { field: 'asda', title: '名称', width: 120, checkbox: true },
                    {
                        field: 'ProClassId',
                        title: '大类',
                        width: 100,
                        formatter: unitformatter,
                        editor: {
                            type: 'combobox',
                            options: {
                                data: productType,
                                valueField: 'ProClassId',
                                textField: 'ProClassName',
                                editable: false,
                            }
                        }
                    },
                    {
                        field: 'ProductBrand',
                        title: '品牌',
                        width: 120,
                        editor: {
                            type: 'text',
                            options: {
                            },
                        }
                    },
                     { field: 'ProductName', title: '名称', width: 120, editor: { type: 'text', options: {}, } },
                    { field: 'Ordercount', title: '数量', width: 60, editor: { type: 'numberbox', options: { min: 0 } } },
                    { field: 'SuggestPrice', title: '建议价格', width: 80, editor: { type: 'numberbox', options: { min: 0, precision: 2 } } },
                    { field: 'Orderprice', title: '实际价格', width: 80, editor: { type: 'numberbox', options: { min: 0, precision: 2 } } },
                    {
                        field: 'Subtotal', title: '小计', width: 80, editor: { type: 'numberbox', options: { min: 0, precision: 2 } }
                    },
                    { field: 'CostPrice', title: '成本价', width: 80, editor: { type: 'numberbox', options: { min: 0, precision: 2 } } },




                ]],
                toolbar: [{
                    text: '添加', iconCls: 'icon-add', handler: function () {
                        if (editRow != undefined) {
                            $("#dk").datagrid('endEdit', editRow);
                        }
                        if (editRow == undefined) {
                            $("#dk").datagrid('insertRow', {
                                index: 0,
                                row: {}
                            });
                            $("#dk").datagrid('beginEdit', 0);
                            editRow = 0;
                            obj = document.getElementsByName("checkbox");
                            var oText = document.getElementById("isd");
                            check_val = [];
                            for (k in obj) {
                                if (obj[k].checked)
                                    check_val.push(obj[k].value);
                            }
                            oText.value = check_val.join(",");
                        }
                        //获取第一行        *关键代码*
                        var editors = $('#dk').datagrid('getEditors', 0);
                        var priceEditor = editors[3];
                        var amountEditor = editors[5];
                        var costEditor = editors[6];
                        priceEditor.target.bind('change', function () {
                            calculate();
                        });
                        amountEditor.target.bind('change', function () {
                            calculate();
                        });

// 计算方法
                        function calculate() {
                            var cost = priceEditor.target.val() * amountEditor.target.val();
                            $(costEditor.target).numberbox('setValue', cost);
                        }
                    }
                },
                {
                    text: '删除', iconCls: 'icon-remove', handler: function () {


                        $('#dk').datagrid('cancelEdit', editRow);
                        var row = $('#dk').datagrid('getSelected');
                        if (row) {
                            $.messager.confirm("警告", "你将删除一行", function (r) {
                                if (r) {
                                    var rowIndex = $('#dk').datagrid('getRowIndex', row);
                                    $('#dk').datagrid('deleteRow', rowIndex);
                                }


                            })


                        } else {
                            $.messager.alert("提示", "请先选择一行再点击删除")
                        }
                        editRow = undefined;
                        $('#dk').datagrid('uncheckAll');


                    }
                }],
                //在用户完成编辑一行的时候触发
                onAfterEdit: function (rowIndex, rowData, changes) {
                    editRow = undefined;
                },
                //在用户双击一个单元格的时候触发。 
                onDblClickRow: function (rowIndex, rowData) {
                    if (editRow != undefined) {
                        $("#dk").datagrid('endEdit', editRow);
                    }
                    if (editRow == undefined) {
                        $("#dk").datagrid('beginEdit', rowIndex);
                        editRow = rowIndex;
                    }
                },
                //在用户点击一行的时候触发
                onClickRow: function (rowIndex, rowData) {
                    if (editRow != undefined) {
                        $("#dk").datagrid('endEdit', editRow);


                    }


                }
            })

0 0
原创粉丝点击