Виджеты внутри додзё dgrid

Некоторое время назад наша компания переехала с dojox/DataGrid на dgrid. Теперь мы выяснили, что dgrid не поддерживает виджеты dijit/dojox из коробки.

dojox/DataGrid имеет formatter(), который может возвращать виджет. Так легко сделать это там! сравнение API на GitHub говорит

«dgrid поддерживает функции форматирования, но не поддерживает возврат виджета из них. dgrid также имеет renderCell, который, как ожидается, возвращает узел DOM. Это якобы может использоваться для отображения виджетов (и плагин столбца редактора делает именно это). Обратите внимание, что для редактирования ячеек настоятельно рекомендуется использовать плагин столбца редактора».

Как именно?

Я попытался использовать плагин редактора с {editor: ' ', editorArgs:' '}. Это действительно отображает виджет, но слишком ограничивает. Например, как отобразить dijit/Button с меткой, являющейся значением ячейки? Или что-то более сложное, как мне использовать (менее известный) dojox/image/MagnifierLite с <img>, сгенерированным из функции форматирования, где src является значением хранилища?


person Gaurav Ramanan    schedule 18.11.2012    source источник


Ответы (1)


вы можете использовать этот пример кода

require(
    [
        "dgrid/List",
        "dgrid/OnDemandGrid",
        "dgrid/Selection",
        "dgrid/editor",
        "dgrid/Keyboard",
        "dgrid/tree",
        "dojo/_base/declare",
        "dojo/store/JsonRest",
        "dojo/store/Observable",
        "dojo/store/Cache",
        "dojo/store/Memory",
        "dijit/form/Button",
        "dojo/domReady!"
    ],

    function(
        List, 
        Grid, 
        Selection, 
        editor, 
        Keyboard, 
        tree, 
        declare, 
        JsonRest, 
        Observable, 
        Cache, 
        Memory, 
        Button
    ) {

        var columns = [
            {
                label:"Actions", 
                field:"id", 
                width: "200px", 
                renderCell: actionRenderCell
            }
        ];

        var actionRenderCell = function (object, data, cell) {

            var btnDelete = new Button({
                rowId : object.id,
                label: "Delete",
                onClick: function () {
                    myStore.remove(this.rowId);
                }
            }, cell.appendChild(document.createElement("div")));

            btnDelete._destroyOnRemove = true;

            return btnDelete;

        }

        grid = new (declare([Grid, Selection, Keyboard]))({
            store: myStore,
            getBeforePut: false,
            columns: columns
        }, "grid");

}
person Ali Soleimani    schedule 22.11.2012
comment
Да! Это работает! Спасибо! В вашем примере вы эффективно используете средство форматирования renderCell в dojox/DataGrid. В документации для dgrid указано, что если применяются и formatter, и renderCell, то formatter игнорируется. Любая идея, почему это разработано так? - person Gaurav Ramanan; 24.11.2012
comment
Этот код работает, но я уверен, что в нем есть утечка памяти. Чтобы избежать это использовать removeRow - person sixtyfootersdude; 13.08.2014