Как обновить сетку данных в Dojo 1.9 после удаления элемента

Я использую Dojo Toolkit 1.9 Datagrid, и я заполняю данные из xmlStore, но я столкнулся с одной проблемой, которая заключается в удалении любого элемента из сетки данных, когда обновление не выполняется до тех пор, пока мы не обновим браузер вручную. Пожалуйста, кто-нибудь может подсказать мне, как я могу это сделать? Исходный код ниже:

<html>
<head>
<title>User Demo</title>
<link rel="stylesheet" href="../dojo-release-1.9.1/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="../dojo-release-1.9.1/dojox/grid/resources/claroGrid.css">
<script src='../dojo-release-1.9.1/dojo/dojo.js'></script>
<script src='myscript.js'></script>
<body>
    <div id="ObjectGrid"></div>
</body>
</html>

    var globalUserId;
    var appContext = "/" + (window.location.pathname).split("/")[1];
    require(
            [ 'dojo/dom', 'dojo/json', 'dojox/json/schema',
                    'dojox/data/JsonRestStore', 'dojox/grid/DataGrid',
                    'dojox/grid/_CheckBoxSelector', 'dojo/on',
                    'dojo/request/xhr', 'dijit/Dialog', 'dojox/data/XmlStore',
                    'dijit/form/FilteringSelect', 'dijit/Calendar',
                    'dijit/form/Form', 'dijit/form/ValidationTextBox',
                    'dijit/form/TextBox', 'dijit/form/FilteringSelect',
                    'dijit/form/Button', 'dijit/layout/TabContainer',
                    'dijit/layout/ContentPane', 'dojo/domReady!' ],
            function(dom, JSON, schema, JsonRestStore, DataGrid,
                    _CheckBoxSelector, on, xhr) {

                var userDataStore12 = new dojox.data.XmlStore({
                    url : appContext + "/rest/userservice/getusers",
                    rootItem : "user"
                });

                var gridCell = [{field : "userid",name : "User Id",width : '10%'},
                        {field : "name",name : "Name",width : '15%'},
                        {field : "email",name : "Email",width : '15%'},
                        {field : "userName",name : "User Name",width : '10%'},
                        {field : "phone",name : "Phone",width : '10%'},
                        {field : "roleName",name : "Role",width : '10%'},
                        {field : "status",name : "Status",width : '10%'},
                        {name : "Action",field : "action",width : '10%',
                            formatter : function(item) {
                                var link = '<a href="#" title="Edit" onClick="updateUserDialog.show()"><div class="dijitIconEdit"></div></a> <a href="#" id="deleteUser" onClick="deleteUser();" title="Delete"><div class="dijitIconDelete"></div></a>';
                                return link;
                            }
                        }];

                gridLayout = [ {
                    // First, our view using the _CheckBoxSelector custom type
                    type : "dojox.grid._CheckBoxSelector"
                }, gridCell ];

                grid = new DataGrid({
                    store : userDataStore12,
                    structure : gridLayout,
                    selectionMode : "single",
                    autoHeight : true
                }, "ObjectGrid");
                grid.startup();

                on(grid, "RowClick", function showDetail(e) {
                    var gridUserId = grid.store.getValue(grid.getItem(e.rowIndex), "userid");
                    globalUserId = gridUserId;
                });
            });
    function deleteUser() {

        require([ 'dojo/dom', 'dojo/request' ], function(dom, request) {
            //request for delete user           
            request.post(appContext + "/rest/userservice/deleteUser", {
                data : "userId=" + globalUserId,
                timeout : 2000
            }).then(function(response) {
                console.log("request sent successfully!!!!!!!");

            });
        });

    }
Источник

1 ответ

Решение

Мне удалось удалить одну строку Datagrid таким образом. Я выбираю строку с помощью флажка, затем вызываю функцию getSelectedItems() с помощью кнопки в конце таблицы, чтобы удалить выбранную строку.

function getSelectedItems(){
  require(["dijit/registry", "dojo/_base/array", "dojo/domReady!"], function(registry, array){
    var items = registry.byId("GraphGrid").selection.getSelected();
    if (items.length) {
        array.forEach(items, function(selectedItem){
        /* Delete the item from the data store: */
    GraphicStore.deleteItem(selectedItem);
        });
    }
  });
 }

Обновить

Это немного позже, и я не уверен, что эта проблема все еще актуальна, но сейчас я решаю эту проблему для себя. Моя проблема была почти такой же, как ваша. У меня есть Datagrid, показанный в ContentPane, и я хочу удалить отдельные строки. Проблема заключалась в том, что после того, как я удалил элемент, Сетка не была обновлена. так что я перезагрузить его

grid.setStore(GraphicStore);

Но ContentPane остался пустым, за исключением заголовков столбцов. Когда я сортирую строки, появляется новая Сетка. Затем я установил оповещение, чтобы увидеть, зарегистрирована ли еще Сетка или нет, и с этим предупреждением Сетка внезапно появляется! Чтобы решить эту проблему, я установил Тайм-аут, чтобы Сетка могла быть полностью загружена (я думаю, это как-то связано с загрузкой), и настроил новый магазин. Появляется гирд - проблема решена.

Я делаю это так:

  setTimeout(function(){
    grid.setStore(GraphicStore);
    }, 1000);

С уважением, Мириам

Источник
Другие вопросы по тегам