How to implement a table component as shown in the image above, which allows for editing content as well as adding or removing Rows and Columns?
Hello @RadisLuo,
Welcome to the builder.io forum post.
To create a table, you can use the Box element. Here’s a fiddle for reference: Builder.io: Visual Development Platform
However, if you need more control over table rows and columns, we recommend creating a custom component instead.
Thanks,
Can I implement it through Next.js code? If possible, how would I go about doing that?
Hello @RadisLuo,
You can certainly create a custom component for editable table using Next Js code and register it with builder to be used in the editor.
I would suggest using formik component to create editable component and then register it with builder
The component is editable, but how is the input data within the component connected to the builder’s InputType? Otherwise, the data entered will be lost when the page is refreshed.
Hello @RadisLuo,
When registering a custom component, create input props and use them in your custom component, you can change these inputs from the builder app and they will not be lost.