флажок выбора для таблицы ag-grid

Я хочу иметь флажок выбора для ag-grid с опцией ниже: Но не видел флажок слева. Есть идеи, какие еще должны быть настройки, чтобы флажок выбора работал.

self.appliancesInGroupGridOpts = {
        angularCompileRows: true,
        enableColResize : true,
        rowData: null,
        checkboxSelection: true,
        enableSorting: true,
        columnDefs: [
          {
            valueGetter: 'data.name',
            headerName: $filter('translate')('APPLIANCE.NAME'),
            suppressSizeToFit : true,
            template: '<span class="appliance-name">{{data.name}}</span>',
            checkboxSelection: true,
            width: 200
          } ,
           {
            valueGetter: 'data.updated',
            headerName: $filter('translate')('APPLIANCE_GROUP.PUBLISH.MODIFICATION_TIME'),
            suppressSizeToFit : true,
            template: '<span class="appliance-updated">{{data.updated}}</span>',
            checkboxSelection: true,
            width: 200
          } 
        ] ,

person kim2014    schedule 21.10.2015    source источник


Ответы (2)


http://www.ag-grid.com/angular-grid-selection/index.php

Выбор флажка можно использовать в двух местах:

  • выбор строки
  • групповой отбор.

Чтобы включить выбор флажка для столбца, установите атрибут

columnDefs: [{
    valueGetter: 'data.name',
    headerName: $filter('translate')('APPLIANCE.NAME'),
    suppressSizeToFit : true,
    template: '<span class="appliance-name">{{data.name}}</span>',
    width: 200,   
    checkboxSelection: true
    ...

в определении столбца.

Вы можете установить этот атрибут для любого количества столбцов, однако не имеет смысла иметь его в нескольких столбцах в таблице.

Чтобы включить выбор флажка для групп, установите атрибут:

groupColumnDef: {
    headerName: "Athlete", 
    field: "athlete", 
    width: 200,
    cellRenderer: {
        renderer: "group",
        checkbox: true
    }
}

для группового рендерера. См. раздел группировки для получения подробной информации о групповом рендерере.

Выбор групп может привести к выбору строки группы или выбору всех дочерних элементов в группе. Это делается установкой атрибута:

groupSelectsChildren: {true || false}
  • Если установлено значение false, то при выборе группы будет выбран узел группы.

  • Если установлено значение true, то выбор группы либо выделит, либо отменит выбор всех дочерних элементов.

В приведенном ниже примере показан выбор флажка с группами. Выбор группы приводит к выбору дочерних элементов. Точно так же выбор всех дочерних элементов автоматически выбирает группу. В этом случае сама группа никогда не появится в списке selectedRows.

В примере также показан флажок для выбора в столбце возраста. На практике наличие более двух столбцов для выбора не является нормой, приведенное ниже предназначено только для демонстрации. Наличие флажка в строке без группировки лучше всего подходит для сеток, которые не используют группировку.

Дополнительно: вы можете добавить это в поле выбора определения столбца:

Установите true, чтобы отобразить флажок выбора в столбце.

person Einav Hacohen    schedule 08.11.2015

Что сказать, Эйнав верен, однако я думаю, что он забыл саму основу:

установите свойство rowSelection:'single' или rowSelection:'multiple' в gridOptions, если вы хотите, чтобы выбор был включен :)

Атрибут checkboxSelection предназначен только для столбцов, а не для параметров сетки.

К выбору относятся следующие свойства:

rowSelection: тип выбора строки, установленный на «один» или «несколько», чтобы включить выбор. rowDeselection: установите значение true или false. Если true, то строки будут отменены, если вы удерживаете нажатой клавишу Ctrl + щелчок по строке. Обычное поведение с сеткой запрещает отмену выбора узлов (т. е. после выбора узла он остается выбранным до тех пор, пока на его месте не будет выбрана другая строка). suppressRowClickSelection: если true, строки не будут выбираться при нажатии. Используйте, например, когда вы хотите выбрать флажок и не хотите также выбирать при щелчке строки.

По той же ссылке, которую дал Эйнав

person Walfrat    schedule 16.01.2016