UI | Rendering HTML inside textarea

Question

UI | Rendering HTML inside textarea

KamilaHasanbega opened this issue 8 years ago · comments

I need to render html inside textarea, in order to have the divs for the names of the attachments, but that's not possible as textarea interprets everything as text (I want to have the UI similar to Gmail web). So what I've tried so far is:

Using a <div> with the contenteditable="true" property, instead of the <textarea> , problems with this are:

I can't have a "<div contenteditable="false" inside it to show the attachments (so the attachments can be deleted as any other text).
Having the <div>'s one after the other separated creates problems with scrolling once you add too many attachments.
https://cloud.githubusercontent.com/assets/14347497/17511757/c2c5c272-5e24-11e6-83cd-27c7a672d6d5.png

@kbsriram Please let me know if I have missed something or if there is any other way.

Krzysztof Kotowicz · Answer 1 · Tue Aug 09 2016 18:18:25 GMT+0800 (China Standard Time)

You should not render HTML from the decrypted message. The text/plain MIME part should be rendered as-is in the textarea, attachment name & links should be bound to different HTML elements in the template (e.g. <div ng-repeat> - see https://docs.angularjs.org/api/ng/directive/ngRepeat)

Don't use <div contenteditable> for security reasons - decrypted text could contain XSS vectors, which would be activated if you put them inside the DOM.