easyui在进行删除数据后进行局部刷新

最新推荐文章于 2021-08-27 15:16:50 发布

RemainderTime

最新推荐文章于 2021-08-27 15:16:50 发布

阅读量1.6k

点赞数

CC 4.0 BY-SA版权

文章标签： js datagrid datele easyui

本文链接：https://blog.youkuaiyun.com/qq_39818325/article/details/86108025

html 专栏收录该内容

5 篇文章

订阅专栏

本文介绍在使用EasyUI的datagrid组件时，如何在删除数据后正确更新前端显示。通过发送AJAX请求到服务器删除数据，并在请求成功后使用特定的datagrid方法更新界面，确保视图与数据库状态一致。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

自己在学习easyui时，删除数据后发现列表中的数据没有消失，但数据库中的数据已经删除了，

过后查阅资料得知，只需在ajax请求成功后再下面加一句代码对datagrid组件的id进行操作即可

$('#role_table').datagrid('reload'); //在向服务器改变数据之后，更新前台数据。

实际代码人如下：

,{
            iconCls: 'icon-remove',
            text:"删除",
            handler: function(){
                var rem=$("#role_table").datagrid("getSelections");
                console.log(rem.length);
                if(rem.length==1){
                    //删除时弹框
                    $.messager.confirm('确认','您确认想要删除记录吗？',function(r){
                        console.log(r);
                        if (r){
                            //获取当前选中的数据的id
                            //发ajax请求都后台删除
                            $.get("delete",{id:rem[0].id},function(data){
                                console.log(data)
                                if(data==1){
                                    $('#role_table').datagrid('reload'); //在向服务器改变数据之后，更新前台数据。
                                    $.messager.show({
                                        title: '系统消息',
                                        msg: '删除成功',
                                        timeout: 3000,
                                        showType: 'slide'
                                    });
                                }else{
                                    $.messager.show({
                                        title: '系统消息',
                                        msg: '删除失败',
                                        timeout: 3000,
                                        showType: 'slide'
                                    });
                                }

                            },"json");
                        }
                    });
                }else{
                    $.messager.alert('系统消息','请选择<span style="color:red" >一行</span>进行删除');
                }
            }

哈哈，完成，不要忘了一键三连，支持支持博主呀。