VvvebJs
VvvebJs copied to clipboard
how to add text input to right area
Hello Everyone!
Today, i want to add the input on the right area ,like it.
how can i start ? Thank you.
Hi
You can check the preformatted component that has a textarea input to edit the content of the selected element https://github.com/givanz/VvvebJs/blob/master/libs/builder/components-html.js#L913-L914 it uses the innerHTML attribute.
You can add the same text property from preformatted component to the base component https://github.com/givanz/VvvebJs/blob/master/libs/builder/components-common.js#L75-L101 to make it available for all components.
The only thing missing is a CodeEditorInput or RichTextEditorInput to use instead of TextareaInput.
For this you can duplicate the TextareaInput code in https://github.com/givanz/VvvebJs/blob/master/libs/builder/inputs.js#L72-L86 and https://github.com/givanz/VvvebJs/blob/master/editor.html#L848-L854
CodeMirror library is already included and used for code editor and the code can be adapted for the input https://github.com/givanz/VvvebJs/blob/master/libs/builder/plugin-codemirror.js#L12
Hi
You can check the preformatted component that has a textarea input to edit the content of the selected element https://github.com/givanz/VvvebJs/blob/master/libs/builder/components-html.js#L913-L914 it uses the innerHTML attribute.
You can add the same text property from preformatted component to the base component https://github.com/givanz/VvvebJs/blob/master/libs/builder/components-common.js#L75-L101 to make it available for all components.
The only thing missing is a CodeEditorInput or RichTextEditorInput to use instead of TextareaInput.
For this you can duplicate the TextareaInput code in https://github.com/givanz/VvvebJs/blob/master/libs/builder/inputs.js#L72-L86 and https://github.com/givanz/VvvebJs/blob/master/editor.html#L848-L854
CodeMirror library is already included and used for code editor and the code can be adapted for the input https://github.com/givanz/VvvebJs/blob/master/libs/builder/plugin-codemirror.js#L12
Thank you for your reply.