XHTML and code inside textareas

Question

On a site of mine in which a textarea is used for submission, I have code that can appear something along the lines of the following:

<textarea><p>text</p></textarea>

When validating (XHTML 1.0 Transitional), this error arises,

line 88 column 50 - Error: document type does not allow element "p" here

If this is not a valid method, then what is expected? I could do a workaround with an onload JavaScript event, but that seems needless. Regardless this doesn't affect the output, but I'd rather my site validate.

Answer 1

Would a CDATA section be an option for you?

<textarea><![CDATA[
    <p>Blah</p>
]]></textarea>

Answer 2

is there a reason you're trying to put a <p> within <textarea>? as you found out it's not valid. if it's for display purposes (ie, showing code) it should be translated:

<textarea>&lt;p&gt;text&lt;/p&gt;</textarea>

beyond validation issues, allowing arbitrary tags (which are not properly encoded as above) to display can be a huge security issue. it's paramount to make sure any user supplied input has been properly sanitized before it is displayed.

Answer 3

Am I right in thinking your trying to make a WYSIWYG editor, such as TinyMCE? What most seem to do is use HTML entities in the textarea and convert it to HTML via JavaScript.

Answer 4

you could use this function on the posted data

function clean_data($value) {
    if (get_magic_quotes_gpc()) { $value = stripslashes($value); }
    $value = addslashes(htmlentities(trim($value)));
    $value = str_replace("\'", "'", $value);
    $value = str_replace("'", "'", $value);
    $value = str_replace(":", ":", $value);
    return $value;
}

Answer 5

You can leave out the tags in the text area, and when you need new lines use \n Otherwise use <p> and </p> in the place of your tags.

Answer 6

You could use an onload function to replace starts and ends tags of the textarea content.

eg: replace < > with &lt; &gt;

<textarea cols="" rows="">&lt;p&gt;text&lt;/p&gt;</textarea>

<p>text</p>