如何从dgrid中删除行

时间:2016-07-05 07:20:27

标签: dojo dgrid

我已经定义了dgrid和一个删除行的按钮:

select to_date(created_at,'format_specifier1')  as created_at , id from table 
where created_at NOT Like '%T%'

UNION ALL

select to_date(created_at,'format_specifier2')  as created_at , id from table 
where created_at Like '%T%'

显示dgrid,您可以对其进行排序,编辑名称或值。

问题是,当你点击“删除”按钮时,行被删除,但是然后,在网格的末尾写了9x:“找不到数据”并且dgrid停止工作(你不能删除任何其他行。)

如果将showLoadingMessage:设置为true,那么一切都可以正常运行。

编辑:我简化了这个例子。问题依然存在。

1 个答案:

答案 0 :(得分:1)

在删除行后更新行数据时,网格可能遇到错误。由于编辑器在按钮失去焦点后尝试更新行。尝试使用grid.removeRow方法删除行。它可能仍会遇到其他一些问题,但值得一试。

Editor可能不是实现您的目标的最佳解决方案。

用户renderCell向网格添加按钮,删除行/记录。这可能是一个更好的解决方案。

更新:只需刷新应该解决问题的网格。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="http://cdn.rawgit.com/SitePen/dgrid/v1.1.0/css/dgrid.css" media="screen" />
</head>
<body class="claro">


    <div id="container"></div>
    <button id="remove">Remove</button>

    <script type="text/javascript">
        var dojoConfig = {
            async: true,
            packages: [
                { name: 'dgrid', location: '//cdn.rawgit.com/SitePen/dgrid/v1.1.0' },
                { name: 'dstore', location: '//cdn.rawgit.com/SitePen/dstore/v1.1.1' }
           ]
        };
    </script>
    <script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
    <script type="text/javascript">
    require([
                'dojo/_base/declare',
                'dojo/on',
                "dojo/dom", 
                "dstore/Memory",
                "dstore/Trackable",
                'dstore/SimpleQuery', 
                'dgrid/Grid', 
                'dgrid/extensions/Pagination',
                'dgrid/extensions/DijitRegistry',
                'dojo/domReady!'
    ],
   function(declare, on, dom, Memory, Trackable, SimpleQuery, Grid, Pagination, DijitRegistry) {
        var data = [];
        for (var i = 1; i <= 500; i++) {
                data.push({id:i,name: 'Name '+i, value: i});
        }

        var Store = declare([Memory, SimpleQuery, Trackable]);
        var myStore = new Store({data:data});

        var MyGrid = declare([Grid, Pagination]);
        var grid = new MyGrid({
                collection: myStore,
                columns: {
                        'id' : 'Id',
                        'name' : 'Name',
                        'value' : 'Value'
                },
                className: "dgrid-autoheight",
                showLoadingMessage: false,
                noDataMessage: 'No data found.'
        }, 'container');
        grid.startup();
        on(dom.byId('remove'),'click',function() {
            myStore.remove(10);
            grid.refresh();
        });
    }); 
    </script>
</body>
</html>