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

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!


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)


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.



Hi,

Thank you for your feedback.

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

Regards,
Lauris Stepanovs,
Keenthemes Support Team



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