基于Jquery EasyUI DataGrid操作弹框输入内容保存信息

筱筱脱脱

已于 2023-07-20 14:03:43 修改

阅读量520

点赞数

文章标签： jquery easyui 前端弹框 datagrid

于 2023-07-19 11:27:16 首次发布

本文链接：https://blog.csdn.net/u012949335/article/details/131804749

版权

var editIndexRy = void 0;
function GetRowIndex(target) {
    var tr = $(target).closest('tr.datagrid-row');
    return parseInt(tr.attr('datagrid-row-index'));
}
function GetDeleteRow(target, dgid) {
    $.messager.confirm('警告', '是否删除此记录?', function (r) {
        if (r) {
            $('#' + dgid).datagrid('deleteRow', GetRowIndex(target));
        }
    });
}
function fnDeleteRyRow(index, dgid, windowsinfoid) {
    fnDeleteRow(dgid, windowsinfoid, index);
}
function fnUpdateRyRow(index, dgid, windowsinfoid, fromid) {
    fnUpdateRow(dgid, windowsinfoid, fromid, index)
}
function fnSaveDg(dgid, wid, fid) {
    if ($("#" + fid).form("validate")) {
        var obj = $("#" + fid).serializeObject();
        var index = obj.index;
        if (index) {
            $("#" + dgid).datagrid('updateRow', {
                index: index,
                row: obj
            });
        } else {
            $("#" + dgid).datagrid("appendRow", obj);
        }
        $("#" + wid).window("close");
        delete obj.index;

    }
}
function fnDeleteRow(dgid, wid, index) {
    $.messager.confirm('警告', '是否删除此记录?', function (r) {
        if (r) {
            $("#" + dgid).datagrid("deleteRow", index);
            $("#" + wid).window("close");
        }
    });
}
function fnUpdateRow(dgid, wid, fid, index) {
    $("#" + dgid).datagrid("selectRow", index);
    var row = $("#" + dgid).datagrid("getSelected");
    if (row) {
        $("#" + wid).window("open");
        $('#' + wid).window("resize", { top: $(document).scrollTop() + ($(window).height() - 250) * 0.5 });
        $('#' + wid).window("center");
        row.index = index;
        $("#" + fid).form("load", row);
    }
}
function fnShowWindow(wid, fid) {
    $("#" + fid).form("clear");
    $('#' + wid).window({
        destroy: true
    });
    $("#" + wid).window("open");
    $('#' + wid).window("resize", { top: $(document).scrollTop() + ($(window).height() - 250) * 0.5 });
    $('#' + wid).window("center");
}
function fnSaveDgReload(dgid, wid, fid, sortname, isorderasc) {
    if ($("#" + fid).form("validate")) {
        var obj = $("#" + fid).serializeObject();
        var index = obj.index;
        if (index) {
            $("#" + dgid).datagrid('updateRow', {
                index: index,
                row: obj
            });
        } else {
            $("#" + dgid).datagrid("appendRow", obj);
        }
        $("#" + wid).window("close");
        var rows = $("#" + dgid).datagrid("getData").rows;
        rows.sort($.sortByInfo(sortname, isorderasc));
        $("#" + dgid).datagrid('loadData', rows);
        delete obj.index;
    }
}
function GetCompareInfoxx(sortname, sortorder) {
    return function (a, b) {
        var value1 = a[sortname];
        var value2 = b[sortname];
        if (sortorder == "asc") {
            return value1 - value2;
        } else {
            return value2 - value1;
        }
    }
}

/**数组根据数组对象中的某个属性值进行排序的方法
* 使用例子：newArray.sort(sortByInfo('number',false)) //表示根据number属性降序排列;若第二个参数不传递，默认表示升序排序
* @param attr 排序的属性 如number属性
* @param rev true表示升序排列，false降序排序
* */
jQuery.extend({
    sortByInfo: function (attr, rev) {
        if (rev == undefined) {
            rev = 1;
        } else {
            rev = (rev) ? 1 : -1;
        }
        return function (a, b) {
            a = a[attr];
            b = b[attr];
            if (a < b) {
                return rev * -1;
            }
            if (a > b) {
                return rev * 1;
            }
            return 0;
        }
    }
});

调用：

<a class="easyui-linkbutton" data-options="iconCls:'icon-save'" onclick="fnSaveDg('dg_jzwyhinfoxx', 'w_jzwyh_windowsinfo', 'form_jzwyh_info')">保存信息</a>
                <a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" onclick="$('#w_jzwyh_windowsinfo').window('close')">取消</a>


<div style="width: 100%">
                                <div id="add_lwcgxxinfo" style="margin-bottom: 5px;">
                                    <input id="btn_lwjhgzjd" onclick="GetAddCgxxInfo('w_jzwyh_windowsinfo','form_jzwyh_info')" type="button" value="新增" style="width: 60px; height: 30px; font-size: 20px;
                                        background: #00A7F7; border: 1px #00A7F7 solid; color: #fff; border-radius: 6px;" />
                                </div>
                                <table id="dg_jzwyhinfoxx">
                                </table>
                            </div>

新增弹框后保存按钮方法：

function GetAddCgxxInfo(widowid, fromid) {
        fnShowWindow(widowid, fromid);
    }

点击保存按钮获取 datagrid 内容信息

if ($("#dg_jzwyhinfoxx").length > 0) {
            var zjjs_zjy = $("#dg_jzwyhinfoxx").datagrid("getData").rows;
            if (zjjs_zjy.length > 0) {
                info.zjjs_zjy = zjjs_zjy;
            }
            else {
                $.messager.alert("提示", "请新增信息)", "error");
                return false;
            }
        }