Hi Animesh,
As we have previously mentioned, when the state variable is
updated, React will re-render all child components, and thus, the selected
records will be deselected, triggering the rowDeselected event. Although, from
the sample video you provided, we can understand that you want the selected
records count in the state variable, to address your concern, we suggest using
the recordClick event instead of rowSelected and rowDeselected
events. By doing so, you can update the state variable with the selected
record's count using the getSelectedRowIndexes method of the Grid. We
have prepared a code snippet for your reference.
|
[index.js]
let gridInstance;
const [selectedRecords,
setSelectedRecords] = useState(0);
function recordClick() {
setTimeout(() => {
setSelectedRecords(gridInstance.getSelectedRowIndexes().length);
})
}
<GridComponent dataSource={data} ref={g => gridInstance = g}
allowPaging={true} pageSettings={{ pageCount: 5
}} recordClick={recordClick} selectionSettings={selectionSettings}>
|
You can also check out our sample on StackBlitz to see this
implementation in action.
Sample: https://stackblitz.com/edit/react-undh6y?file=index.js
We hope this solution resolves your issue. Please feel free
to reach out if you have any further questions.
Regards,
Santhosh I
