-
Notifications
You must be signed in to change notification settings - Fork 777
Description
Using BootstrapTable in reactjs app that populates data from .net core api.
My question is How to re-render data when row checkbox checked or unchecked.
I am displaying checkbox for one of the boolean column and disable/enable based on the row checkbox selection. Following is the code from columns definition
formatter: (cellContent:boolean, row:IFacilityReportType) => (
<input type="checkbox"
id={"primaryCheckbox"+row.facilityReportTypeId}
style={{opacity:1}}
defaultValue={row.facilityId}
onChange={(event)=>selectPrmaryContact(event, row)}
disabled={row.isRowSelected?false:true}
checked={row.isPrimary?true:false}
/>
)
In the above code, the isRowSelected is one of the data column that has false initially and all the checkboxes are disabled. When row checkbox checked/unchecked this column will get switch to true/false and column checkbox should be enable or disable. This is not happening. Its look like data is not rendering/reloading when column data changed in row selection.
Following is the row selection event code.
const selectRowFacilities:any = {
mode: 'checkbox',
selected:refeshFacilityTable==='yes'? []:null,
onSelect: (row:IFacilityReportType, isSelect:any, rowIndex:any, e:any) => {
if(isSelect){
row.isRowSelected=true;
}
else{
row.isRowSelected=false;
}
},
onSelectAll: (isSelect:any, rows:IFacilityReportType[], e:any) => {
if(isSelect){
rows.forEach(row=>{
row.isRowSelected=true;
});
}
else{
rows.forEach(row=>{
row.isRowSelected=false;
});
}
}
};