Introducing ReUI:Open-source UI components and apps built with React, Next.js and Tailwind CSS
Browse ReUI
Light
Dark
System
Ask  Question

Metronic React Demo Forms


Hi,

I want to create a form with interactions similar to those in Metronic 8 demo 39 catalog: link <a>https://preview.keenthemes.com/metronic8/demo39/apps/ecommerce/catalog/add-product.html</a>. I'm using Metronic 8 with React and need to integrate a form that includes features like multiple image uploads and dynamic fields, just like in the provided example.

Any help would be greatly appreciated. Thank you!


user
Raju Lohar 8 months ago
Bootstrap React Bootstrap 5
3 Answers
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)

user
Raju Lohar 8 months ago

I have a suggestion regarding the demo. HTML has some excellent templates, and it would be beneficial if some of them could be migrated to React. Alternatively, creating a tutorial on how to migrate HTML code to React would be very helpful.

Thanks for your response.


user
Lauris Stepanovs Author8 months ago

Hi,

Thank you for your feedback.

We will consider adding such a tutorial in the next Metronic releases.

Regards,
Lauris Stepanovs,
Keenthemes Support Team


user
Lauris Stepanovs Author8 months ago

Hi,

Sorry for the delay in reply.

Currently, we do not have any image upload solutions present in our React version. You might consider either adopting our solution from html version or using this React component for image uploading. https://www.npmjs.com/package/react-images-uploading

Regards,
Lauris Stepanovs,
Keenthemes Support Team


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  :(