Comment form problem with comment_author_url and HTML5 input placeholders

by

I’m using HTML5 on two sites running two different versions of WordPress. They both exhibit the same behaviour and I would like some help with fixing this please. 

<label for="url">Website</label> <input type="url" name="url" id="url" value="<?php echo esc_attr($comment_author_url); ?>" placeholder="Enter Website Address (optional)" pattern="https?://.+">

In testing, we have identified a problem with comment_author_url that occurs when people do not input an URL. For some reason, WordPress is picking up the placeholder text and saving it into the database, like so:

http://EnterWebsiteAddress(optional)

I’m having real trouble trying to identify why this is happening. The placeholder attribute isn’t inside the input value so should not be getting picked up. This same code is being used in other applications without problems.

Does anyone know how to correct this in WordPress?

UPDATE:
I’ve done considerable research on this and thought I’d share my findings.
The issues come from the comment_form function within WordPress itself.

To avoid the problems there are two options:

  1. Only use placeholders on required fields. When the fields get focus and something is input the placeholder gets cleared.
  2. Use JavaScript to clear placeholders before the form is submitted.

I hope this helps the others that have run into the same issues. I’m not submitting a patch to WordPress because, at this time, WordPress only intends to support XHTML.

2 Answers
2

I am also having this issue, haven’t found any solutions for it, apart from just plain ‘ol removing the placeholder attribute : / it seems to occur in any browser. I am using a JavaScript fallback for browsers that dont support the placeholder attrib, but with or without it, wordpress seems to pick up the placeholder text as the value for the input.

Leave a Comment