Custom Editor not triggering blur

[arielshad]

Clicking outside the table / on another custom editor dosen't trigger the on blur event
https://react-bootstrap-table.github.io/react-bootstrap-table2/storybook/index.html?selectedKind=Cell%20Editing&selectedStory=Custom%20Editor&full=0&addons=1&stories=1&panelRight=0&addonPanel=storybook%2Factions%2Factions-panel

[arielshad]

Solved it by wrapping the editor component with https://github.com/airbnb/react-outside-click-handler
and triggering onUpdate function when clicking outside, if there is another solution or fix I would be more than happy to know

[AllenFang]

hi @arielshad sorry for lately reply, if you have a custom editor, you have to add onblur event on your component. react-bootstrap-table2 will pass onBlur callback for you:

{
  dataField: 'quality',
  text: 'Product Quality',
  // editorProps.onBlur <<<< you can call it when you catch the blur event on your custom component
  editorRenderer: (editorProps, value, row, column, rowIndex, columnIndex) => (
    <QualityRanger { ...editorProps } value={ value } />
  )
}

Thanks