自定义标题复选框以选择现有的渲染行单元格

时间:2019-06-09 19:05:07

标签: ag-grid ag-grid-react ag-grid-angular

我正在尝试在标题中添加自定义列复选框以选择现有的 呈现的行以更新状态和UI,但由于 headerCheckboxSelection true不受现有渲染数据的限制

我尝试过的是在标题单元格上添加了以下自定义渲染器,但是 看起来现在已过时,无法正常工作

const headerCellRendererFunc = params => {
    alert("testing custom he")
    var cb = document.createElement('input')
    cb.setAttribute('type', 'checkbox')
    alert("in checkbox function")
    var eHeader = document.createElement('label')
    var eTitle = document.createTextNode(params.colDef.headerName)
    eHeader.appendChild(cb)
    eHeader.appendChild(eTitle)

    cb.addEventListener('change', function (e) {
        console.log("inside headerCellRendererFunc")
    })
    return eHeader
}

基本上,在添加以下代码时,它会在该列和 行,但不绑定到现有的呈现数据

headerCheckboxSelection: true,
headerCheckboxSelectionFilteredOnly: true,
checkboxSelection: true

我想要的是用于全选或取消全选的自定义复选框,应该在 现有的基于布尔的复选框已呈现。这些行从 后端api

cellRenderer: params => `<input type='checkbox' ${params.value ? 'checked' : ''} />`

0 个答案:

没有答案