Редактор DGrid - изменение отображаемого значения при попытке редактирования текстовой ячейки

Question

Я использую столбец редактора DGrid для редактирования содержимого магазина. Из полей, которые я хочу редактировать, один объект. Когда я нажимаю на поле для его редактирования, я хочу, чтобы значение, отображаемое в редакторе, соответствовало значению, отображаемому сеткой, когда оно не редактируется. Форматирование ячейки просто показывает значение объекта, но когда я нажимаю на поле для его редактирования, вместо значения объекта я вместо этого заполняю поле «Объект объекта». Я все еще могу отредактировать его (хотя результаты этого - это то, что поле будет отображаться «неопределенным» до тех пор, пока я не обновляю страницу, но я могу просто принудительно обновить после изменения), но не может показаться, что он показывает, что Я хочу.
Вот настроить код:

// build the store 
       this.postStore = Observable(Memory({ 
        data: posts 
       })); 

       var formatCategory = function(object, data, cell) { 
        cell.innerHTML = object.category.value; 
       }; 

       var formatAuthor = function(object, data, cell) { 
        cell.innerHTML = object.author.value; 
       }; 

       var formatDate = function(object, data, cell) { 
        cell.innerHTML = new Date(object.dateCreated).toISOString(); 
       }; 

       // the columns displayed in the grid 
       var columns = [ 
        selector({ 
         field: 'checkbox', 
         label: ' ', 
         selectorType: 'radio', 
         width:33 
        }), 
        { 
         label: "Author", 
         field: "author", 
         width: 120, 
         renderCell: formatAuthor 
        }, 
        editor({ 
         label: "Title", 
         field: "title", 
         editor: "text", 
         editOn: "click", 
         width: 200 
        }), 
        editor({ 
         label: "Text", 
         field: "text", 
         editor: "text", 
         editOn: "click", 
         width:500 
        }, Textarea), 
        editor({ 
         label: "Category", 
         field: "category", 
         editor: "text", 
         editOn: "click", 
         width: 150, 
         renderCell: formatCategory 
        }), 
        { 
         label: "Date", 
         field: "date", 
         renderCell: formatDate, 
         width: 120 
        } 
       ]; 

       if (this.postGrid) { 
        this.postGrid.set("store", this.postStore); 
       } else { 
        var SelectionGrid = new declare([OnDemandGrid, Selection, Keyboard, editor, selector, DijitRegistry, ColumnResizer]); 
        this.postGrid = new SelectionGrid({ 
         store: this.postStore, 
         columns: columns, 
         selectionMode: 'none', 
         sort: [{attribute: "date", descending: false}] 
        }, this.postGridDiv); 
        this.postGrid.startup(); 

        this.postGrid.on("dgrid-select, dgrid-deselect", lang.hitch(this, this._postSelected)); 

        this.postGrid.on("dgrid-datachange", lang.hitch(this, function(evt){ 
         var cell = this.postGrid.cell(evt); 
         var post = cell.row.data; 

         if (cell.column.field === "title") { 
          post.title = evt.value; 
         } else if (cell.column.field === "text") { 
          post.text = evt.value; 
         } else if (cell.column.field === "category") { 
          post.category.value = evt.value; 
         } 

         this._updatePost(post); 
        })); 

Answer 1

Вместо определения renderCell функции, определяют get функцию (которая используется для преобразования значения, прежде чем он даже послал к renderCell) и set функцию (которая используется для преобразования данных обратно до их отправки в хранилище при сохранении изменений).

Что-то вроде:

get: function (object) { 
    return object.category.value; 
}, 
set: function (object) { 
    return { value: object.category }; 
} 

Смотрите также documentation.