Open ngoctienvc opened 4 years ago
constructor(props) {
super(props);
this.tblRef = React.createRef();
this.state = {
columns: [
{
type: 'selection',
selectable: row => {
return row.disabled ? false : true;
}
},
{
label: 'Date',
prop: 'date',
width: 150
},
{
label: 'Name',
prop: 'name',
width: 160
},
{
label: 'Address',
prop: 'address'
}
],
data: [
{
date: '2016-05-03',
name: '123',
address: 'No. 189, Grove St, Los Angeles',
disabled: true
},
{
date: '2016-05-04',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles'
}
]
};
}
componentDidMount() {
this.toggleSelection([this.state.data[0], this.state.data[1]]);
}
toggleSelection(rows) {
if (rows) {
rows.forEach(row => {
this.tblRef.toggleRowSelection(row);
});
} else {
this.tblRef.clearSelection();
}
}
render() {
const { columns, data } = this.state;
return (
<Table
ref={elm => (this.tblRef = elm)}
style={{ width: '100%' }}
columns={columns}
data={data}
border={true}
height={250}
onSelectChange={selection => {
console.log(selection);
}}
onSelectAll={selection => {
console.log(selection);
}}
/>
);
}
Description:
I had created a version demo for selection all. when i set to attributes column: selectable is false then display select all is wrong. Same image attach
`
and when i tick into input check selection check all then row disabled miss is-checked.
![Capture2](https://user-images.githubusercontent.com/6822108/75757283-ab48a900-5d64-11ea-935a-acfc39c81b18.PNG)