How to capture show.bs.modal event for modal in React

Hello
we are opening the modal as shown in the react demo. We are to know when the modal is shown and closed. How can we capture the show.bs.modal and hidden.bs.modal event.

Your early response is appriciated.

Regards
Farhan

Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)

Hi,

Bootstrap Modal isn't a SPA component, and cause of that we don't use it in our React app.
Instead we prepared example of modal: https://preview.keenthemes.com/metronic8/react/demo1/apps/user-management/users (Add/Edit user). You can check of the modal here demo1/src/app/modules/apps/user-management/users-list/UsersList.tsx.

Regards,
Keenthemes support

Thanks for your reply.
well this user management is not available in the react demo we are using. we are using the 8.0.36 and I see the link you have sent is ver 8.0.38.

It 8.0.38 available for download?

I just checked the change log and found that you have removed the redux for auth, this is big change is there any specific reason for this change?

Regards
Farhan

Hi again,

1. This is the link for downloading the latest version of Metronic https://devs.keenthemes.com/metronic.
2. Redux was removed during our work on performance approval (actually the bundle size was reduced by more than 10%). Actually, the current solution (based on React ContextAPI + ReactQuery) is much easier, clear, clean, maintainable, and expandable.
Our User-Management solution is also based on ReactQuery. It helped us to remove Redux/ReduxThunk (and dependencies).
Users may use Redux anyway if they want, there are no restrictions here.

Regards,
Keenthemes support

Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(