How to enable HTML in input text field?

Question

How can I enable HTML in a text field so that users can enter HTML in the text field and when submitted, the HTML gets parsed and shown in the browser? Now, I'm using the normal form element for the text field as:

<input id="todo" type="text">

What do I need to change? The type ?

Answer 1

You don't have to do anything. HTML is text, so users can type HTML into a text field if they like.

Changing the type to html just makes it an unknown type, so browsers treat it as text .

If you are accepting HTML then you need to carefully sanitise it before displaying it back to the browser, otherwise you are opening up an XSS security vulnerability .

Answer 2

If you would like to enable HTML markup in input field, use <textarea id="todo"></textarea> It will give you a much bigger box.

Optionally you can use TinyMCE which is easy to use and powerful WYSIWYG tool.

But to show the code when submitted you need to know PHP, Python programming language or something like those.

Answer 3

What you are looking for is called WYSIWYG editor. (What You See Is What You Get)

You have great many of these, some for free - just Google for "WYSIWYG editor" and see for yourself.

I once used FCKeditor and it's pretty simple and powerful though I believe by now there are better editors available.