MVC Helper TextArea - Placeholder not displaying

Question

I have the following code in my .cshtml:

 @Html.TextArea("txtComments", new { style = "width: 450px;", placeholder = "Enter Comments here" })

But the placeholder is not displaying at all. Am I missing something?

Source:

<textarea cols="20" id="txtComments" name="txtComments" placeholder="Enter Comments here" rows="2" style="width: 450px;">
</textarea>

Solution

Put an @ before the style and placerholder, like so, maybe even put htmlAttributes: before it.

@Html.TextArea("txtComments", htmlAttributes: new { @style = "width: 450px;", @placeholder = "Enter Comments here" })

And this is the exact output I get:

<textarea cols="20" id="txtComments" name="txtComments" placeholder="Enter Comments here" rows="2" style="width: 450px;"></textarea>

If this shows a placeholder but it still isn't showing, make sure you're using an up-to-date web browser, you can find a list of the supported browsers here: http://caniuse.com/input-placeholder

< IE10 does not support it.

If you do need support in those browsers, maybe this solution will help you: http://webdesignerwall.com/tutorials/cross-browser-html5-placeholder-text

Comments

[Adam K Dean]

Then something else is the problem as that code works for me. Can you post the html that is generated by your @Html.TextArea line? Check that the placeholder isn't there but your css has stopped it dispalying.

[user2067567]

should be a bowser thing. am using IE8. Thanks

[Adam K Dean]

Consider upgrading to browser which supports modern internets, such as Firefox or Chrome. This will fix your issues but remember, anyone using your apps who uses old browsers will not be able to see placeholders. Bear this in mind.

[user2067567]

yes i have chrome. But my client uses IE. so i use for DEV :) Thanks

[user2067567]

i cant Vote up . i need 15 :D

[Adam K Dean]

No problem, there are fixes for IE I'm sure. Deploy the Google fu!

[Dan Beaulieu]

Interesting, this works: new { @placeholder = "Into / Teaser Text" } ) but this does not: new { htmlAttributes = new { @class = "form-control", placeholder = "Friendly Url" } } nor does it work with @placeholder

[Aaron]

Dan Beauliei: This was my issue! Thanks. Your comment fixed mine. I removed the "htmlAttributes" but and just started with new { and now it works! Winner, thanks mate.

[JustJohn]

Me too! I moved it forward into the first new and it works for TextAreaFor.: Html.TextAreaFor(model => model.OtherComments, new { placeholder = "Optional", htmlAttributes = new { @class = "form-control", rows = "4", cols = "50"} }) EditorFor it goes in htmlAttributes area. I used "@" for both.