8

I have the following textbox in my View:

enter image description here

The code for the placeholder:

@Html.TextBoxFor(m => m.Listing.Location.AddressLine1, new {@placeholder="Address Line 1 - Required"})

Question: How do I make the text "Required" in RED.

Subby
  • 5,370
  • 15
  • 70
  • 125

2 Answers2

4

You can't do this with a text field. You have no control over the formatting of only some portions of the HTML5 placeholder attribute. Not to mention that if you want to achieve multicolor text you can no longer use a text field or textarea. You will have to use an element with contenteditable="true" attribute and write your custom plugin.

Here's for example how the markup might look like:

<div contenteditable="true">
    Address Line 1 - <span style="color: red">Required</span>;
</div>

But since this is a div element you will now have to back it up with a corresponding hidden field so that the value is sent to the server. Also when the value of this field changes you need to resynchronize the hidden field value as well. It will be a lot of work.

Darin Dimitrov
  • 1,023,142
  • 271
  • 3,287
  • 2,928
  • 1
    This is not completely true, you can style the placeholder with css (in some browsers) http://stackoverflow.com/questions/2610497/change-an-inputs-html5-placeholder-color-with-css ... – nemesv Oct 15 '12 at 15:12
  • 1
    @nemesv, yeah fine, but he wants to style only a portion of the placeholder text. I've updated my answer to account for that. – Darin Dimitrov Oct 15 '12 at 15:13
  • Yeah, it requires some coding but definitely not impossible. – Darin Dimitrov Oct 15 '12 at 15:18
0

in model

[Required]

public string AddressLine1{ get; set; }

@Html.TextBoxFor(model => model.Listing.Location.AddressLine1, new { @class = "form-control" , placeholder = "Address Line 1 - Required" })

try this for an empty @Html.TextBox

@Html.TextBox("CustomarName" ,null, new { @class = "form-control" , @placeholder = "Search With Customar Name" })
Mizanur Rahman
  • 272
  • 2
  • 11