Question

我希望在row.isSelected（）中用奇偶校验检查表中的一列复选框。

使用VirtualDOM时，不会在表中检查/取消选中缓冲区中的行。getRows（）循环可取消选中该框。通过row.deselect（）从表POV中取消选择行。

该复选框的第一列中添加了一个变量：

i = df.loc[:,df.columns[df.iloc[0]]].filter(like='value').columns.str.split('.').str[-1].astype(int).tolist()

my_dict = {1: ('a', 'category'),2: ('b', 'category'),\
           3: ('c', 'category'),4:('d','category'),\
           5:('e','subcategory'),6:('f','subcategory'),\
           7:('g','subcategory'),8:('h','subcategory'),\
           9:('i','subcategory'),10:('j','subcategory'),\
           11:('k','subcategor'),12:('l','subcategory'),\
           13:('m','subcategory'),14:('n','subcategory'),\
           15:('o','subcategory'),16:('p','subcategory'),\
           17:('q','subcategory'),18:('r','subcategory'),\
           19:('s','subcategory'),20:('t','subcategory'),\
           21:('u','subcategory'),22:('v','subcategory'),\
           23:('w','subcategory'),24:('x','subcategory')}

df1 = pd.DataFrame.from_dict(my_dict, orient='index')

df_out = df1.loc[i].set_index(1).T

print(df_out)

全选逻辑：

1 category subcategory
0        a           f

可以通过在rowFormatter中添加一些逻辑以在首次渲染时对其进行检查来检查DOM中根本不存在的行。

可能无法修复，但我认为值得一问。

Answer 1

因为Tabulator使用虚拟DOM，只有可见的行实际上存在，所以滚动时会创建和销毁行。

因此，从外部尝试并操纵表中的任何DOM元素都是不安全的。

根据您的情况，您应该使用Custom Formatter，该行在行组件上使用 isSelected 函数来确定是否应选中该复选框已创建。

//custom formatter
function checkboxFormatter(cell, formatterParams, onRendered){

    //create input element
    var input = document.createElement("input");
    input.setAttribute("type", "checkbox");


    //set checked state
    input.checked = cell.getRow().isSelected();

    return input;
}

//assign formatter in column definition
{title:"selected?", formatter:checkboxFormatter}

然后，您应该使用 rowSelectionChanged 选项在选择更改后重新绘制行，这将使格式化程序运行并更新复选框。

rowSelectionChanged:function(data, rows){
    //rows - array of row components for the selected rows in order of selection
    //data - array of data objects for the selected rows in order of selection

    //reformat all rows that have changed
    rows.forEach(function(row){
        row.reformat();
    })
}

然后，您可以通过调用表上的 selectRow 函数来选择表中的所有行。

table.selectRow();

VirtualDOM缓冲区行中的JQuery

1 个答案: