Dojo dgrid: нет выделения при выборе в невидимой части сетки

У меня проблема с выбором в OnDemandGrid (dojo 1.12.1), и мне нужна помощь. Часть моей сетки скрыта при создании, и это делает выбор «одиночным» странным, выбор активен только для видимой части содержимого. Пока я прокручиваю, у меня больше нет выделения в строке img1. Однако, если я применяю сортировку к столбцу, содержимое обновляется, и вся строка становится доступной для выбора.

Пример на этой странице работает для EnhancedGrid в selectionMode: «single» без ошибок в скрытой части содержимого после загрузки. https://dojotoolkit.org/reference-guide/1.10/dojox/grid/EnhancedGrid/plugins/Selector.html, есть идеи, как этого добиться?

Что я мог сделать при создании OnDemandGrid, чтобы решить эту проблему? Я пытался поставить параметр css box-sizing: border-box, но мне это не помогло.

Есть некоторые проблемы с симуляцией для enchancedgrid, но решение мне не подходит, возможно, это связано с тем, что я использую OnDemandGrid (элементы dojo EnchancedGrid не выбираются программно в невидимой части представления)

require([
     ...
    'dojo/store/Memory',
    'dgrid/OnDemandGrid',
    'dgrid/Selection',
    'dgrid/extensions/ColumnResizer',
    'dgrid/extensions/DijitRegistry'

], function (Memory, OnDemandGrid, Selection, ColumnResizer, DijitRegistry ) {
     var columNs = {First_Name: {label: 'First Name'},
                    Last_Name: {label: 'Last Name'},
                    hello: {label: 'hello'},
                    age: {label: 'age'},
                    size: {label: 'size'},
                    name: {label: 'name'},
                    code: {label: 'code'},
                    id: {label: 'id'},
                    mdp: {label: 'mdp'},
                    username: {label: 'username'},
                    grid: {label: 'grid'}
                    };

   var store = new Memory({ data: createData() });  

   var CustomGrid = declare([OnDemandGrid, Selection, ColumnResizer, DijitRegistry]);

   var grid = new CustomGrid({
                        selectionMode: 'single',
                        cellNavigation: false, 
                        store: store, 
                        columns: columNs
                    }, 'grid');          
   grid.startup();



   function createData() {
        var data = [];
        var column;
        var i;
        var item;

        for (i = 0; i < 50; i++) {
            item = {};
            for (column in { First_Name: 1, Last_Name: 1, hello: 1, age: 1, size: 1, name: 1, code: 1, id: 1, mdp: 1, username: 1, grid: 1 }) {
                item.id = i;
                item[column] = column + '_' + (i + 1);
            }
            data.push(item);
        }

        return data;
    }
});

//css
.dgrid {
    height: 25em !important;
    width: 100%;
}
.dgrid .dgrid-scroller {
    margin-top: 24px !important; 
}
.dgrid-cell { 
    width: 70px !important;
}
.dgrid-column-set-scroller {
display: inline-block;
overflow-x: auto;
overflow-y: hidden;

}


person dev256    schedule 10.07.2017    source источник
comment
Здравствуйте и добро пожаловать в StackOverflow. Пожалуйста, найдите время, чтобы прочитать страницу справки, особенно разделы с названиями Какие темы я могу задать здесь? и Каких вопросов следует избегать?. И что еще более важно, прочтите контрольный список вопросов о переполнении стека. Вы также можете узнать о минимальных, полных и проверяемых примерах.   -  person herrbischoff    schedule 10.07.2017


Ответы (1)


Я не смог воспроизвести вашу проблему. См. скрипку здесь.

Одно отличие в том, что я заменил dojo/store/Memory, который выдавал мне ошибку (если вы не получаете эту ошибку, возможно, вы используете версию dgrid старше 0.4?), на dstore/Memory.

Затем скрипка использует dojo 1.12.2 (не должно быть разницы с 1.12.1) и dgrid/dstore 1.1.0 (это может объяснить разницу, если вы используете значительно более старую версию). Он также использует claro.css от dijit и dgrid.css от dgrid. См. ниже (извлеченный из jsfiddle) часть вашего исходного кода, которую я изменил:

require({
    packages: [
        {
            name: 'dgrid',
            location: '//cdn.rawgit.com/SitePen/dgrid/v1.1.0'
        },
        {
            name: 'dstore',
            location: '//cdn.rawgit.com/SitePen/dstore/v1.1.0'
        }
    ]
},[
            "dojo/_base/declare",
            'dstore/Memory',
            'dgrid/OnDemandGrid',
            'dgrid/Selection',
            'dgrid/extensions/ColumnResizer',
            'dgrid/extensions/DijitRegistry'

], function (declare, Memory, OnDemandGrid, Selection, ColumnResizer, DijitRegistry ) {
person Jean-Claude Hujeux    schedule 13.07.2017