Отображение грязного треугольника ячейки на сетке при изменении источника данных вручную

У меня есть сетка кендо с пользовательским всплывающим окном редактирования, чтобы имитировать всплывающее редактирование, но с пакетным редактированием. Все работает хорошо, но я испытываю небольшую проблему. Всякий раз, когда значение изменяется, ячейка сетки не имеет того Красного треугольника в углу, указывающего, что это конкретное значение отличается от исходного.

Как я понимаю в этом посте, вручную внесенные изменения в datasource не появляются в сетке, поэтому я должен добавить их вручную.

Эта запись «вручную поддерживать маркер грязной ячейки на подкачке в Kendo grid» дает представление о том, как заставить его работать. Я мог бы прикрепить некоторые слушатели к входам kendowindow, отслеживать, какие поля редактируются, сравнивать старые и новые значения…

Но есть ли менее болезненный способ достичь этой функциональности? Может быть, есть некоторые встроенные функции кендо для достижения этого?

Вот небольшой рабочий пример http://dojo.telerik.com/aSaXe/4

2 ответа

  1. Красные «грязные» метки появляются автоматически только при использовании встроенного редактирования в ячейке. С этой точки зрения сценарий требует, чтобы они были добавлены вручную после закрытия всплывающего окна пользовательское редактирование.

    changeСобытие элемента данных может оказаться полезным в задаче. Он будет срабатывать каждый раз, когда значение во всплывающем окне изменяется и соответствующее текстовое поле размывается.

    var uid = $(e.target).parents('tr').attr('data-uid');
    var grid = $('#grid').data("kendoGrid");
    var dataItem = grid.dataSource.getByUid(uid);
    
    dataItem.bind("change", function(args) {
      // args.field
    });
    

    И, наконец, помните, что каждое изменение в источнике данных сетки приводит к перерисовке всей таблицы (если не используется встроенное редактирование в ячейке), поэтому вы потеряете любой ранее примененный пользовательский стиль.

  2. Вы можете использовать событие save в вашей сетке кэндо как:

    save: function (e) {
                        addDirtyUid(e.model.uid);
                        setTimeout(refreshVisualDirtyElements, 100);
                    }
    

    Другие функции и var:

    var dirtyIds = [];
    function addDirtyUid(currentUid) {
        if (dirtyIds.indexOf(currentUid) === -1) {
            dirtyIds.push(currentUid);
        }
    }
    
    function refreshVisualDirtyElements() {
        for (var i = 0; i < dirtyIds.length; i++) {
            var thisUid = dirtyIds[i];
            $("tr[data-uid='" + thisUid + "']").find("td:eq(0)").addClass("k-dirty-cell");
            $("tr[data-uid='" + thisUid + "']").find("td:eq(0)").prepend('<span class="k-dirty"></span>');
        }
    }