使用easyui 框架 遇到自动刷新还是旧数据的问题

2020-08-19  本文已影响0人  螃蟹和骆驼先生Yvan

这两天我用easyui 框架做了一个编辑表单遇到个问题,自动刷新还是旧数据:
样例:


案例

前端

样式:
#have{
    width:600px;
    height:200px;
}
.hope {
    max-height: 180px; //限制高度
    overflow-y: auto; //滑轮需要div包裹
}
    <div  class="hope">
                <table id="have" title="师傅扣款记录" singleSelect="true"  toolbar="#toolbar" idField="id" rownumbers="true" fitColumns="true" >
                    <thead>
                    <tr>
                        <th field="orderId" width="100" editor="{type:'validatebox',options:{required:true}}">订单id</th>
                        <th field="creationTime" width="100" editor="text">时间</th>
                        <th field="goAmount" width="100" align="right" editor="numberbox">走保金额</th>
                        <th field="amount" width="100" align="right" editor="numberbox">财务扣款金额</th>
                        <th field="wdAmount" width="190" align="right" editor="numberbox">网点扣款金额</th>
                        <th field="financialDeductions" width="100" editor="numberbox">欠款金额</th>
                        <th field="name" width="100" editor="text">操作人</th>
                        <th field="comment" width="100" editor="text">备注</th>
                    </tr>
                    </thead>
                </table>
            </div>
            <div id="toolbar">
                <a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="javascript:$('#have').edatagrid('saveRow')">保存</a>
                <a href="#" class="easyui-linkbutton" iconCls="icon-undo" plain="true" onclick="javascript:$('#have').edatagrid('cancelRow')">Cancel</a>
                <a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="javascript:$('#have').edatagrid('addRow')">添加</a>
            </div>
js内容:
    $(function () {
            $('#have').edatagrid({
                url: '${basePath}' + "/orderSys/deposit/getDepositId/" + ${id}, //查询
                <%--updateUrl: '${basePath}'+ "/orderSys/deposit/getDepositupdate/"+"0",--%> //修改
                saveUrl: '${basePath}'+ "/orderSys/deposit/getDepositupdates/" + ${id}, //添加
                onAfterEdit: (rowIndex, rowData, changes) => { //添加之后触发
                        // let datas = $('#have').datagrid('getData')
                        // console.log('onAfterEdit',datas.rows.length,datas.rows,rowData)
                        // if (rowIndex > 0){
                        //  let before = datas.rows[rowIndex - 1];
                        //  rowData.financialDeductions = Number(before.financialDeductions) - Number(rowData.amount)
                        // console.log("aa",rowData.financialDeductions);
                        //
                        // }
                        $('#have').edatagrid('loading')
                        setTimeout(() => {    //延迟加载
                            $('#have').edatagrid('load')
                            $('#have').edatagrid('loaded')
                        }, 2000)
                    }


                });
        });

其实用了easyui的框架的可编辑表单,每次添加都有自动刷新功能,但是问题来了,其实我们刷新的速度比添加快,造成拿的是旧数据,所以延迟2秒可以解决

上一篇下一篇

猜你喜欢

热点阅读