jason328 jason328 - 1 month ago 5
HTML Question

Text Field Tag Placeholder Returning As Value

I have a form and inside the form there is a text_field_tag. It is written as this...

<%= text_field_tag "search", :placeholder => 'Enter search term...' %>


However, when the HTML is generated this returns in the page source...

<input id="search" name="search" type="text" value="{:placeholder=&gt;&quot;Enter search
term...&quot;}" />


Why is it doing this and how do I fix it so that placeholder works?

Answer

The second parameter of the text_field_tag is the value. Give it nil to have it empty:

<%= text_field_tag "search", nil, :placeholder => 'Enter search term...' %>

And give it a String to have a default value:

<%= text_field_tag "search", 'Enter search term...' %>

Add an onclick event to empty it with jQuery:

<%= text_field_tag "search", 'Enter search term...', :onclick => 'if($(this).val()=="Enter search term..."){$(this).val("");};' %>

Edit 2016:

Nowadays, most of the browsers now support the HTML 5 placeholder, which allows us to do this in a cleaner way:

<%= text_field_tag 'search', nil, placeholder: 'Enter search term' %>
# which produces the following HTML:
<input type="text" value="" placeholder="Enter search term">

jsFiddle link

Comments