adding css and id selector to input box (razor helper)

Question

Inside razor view I have textbox rendered by razor helper

@Html.EditorFor(model => model.Caption, 
       new { htmlAttributes = new { @class = "form-control" } })

I want to add css id class together with this form-control class so I tried

@Html.EditorFor(model => model.Caption, 
        new { htmlAttributes = new { @class = "form-control", @id="myId" } })

but this doesnt work.

Have you tried `@Html.EditorFor(model => model.Caption, new { @class = "form-control", @id="myId" } )`? — adricadar, Mar 28 '15 at 15:50

score 0 · Answer 1 · edited May 23 '17 at 10:24

0

You have to use TextBoxFor() if you want to specify htmlAttributes:

@Html.TextBoxFor(model => model.Caption, 
    new { @class = "form-control" } )

Have a look at this SO post(Dimitro's Answer)

edited May 23 '17 at 10:24

Community

1
1

answered Mar 28 '15 at 16:08

Ehsan Sajjad

61,834
16
105
160

score 0 · Accepted Answer · edited May 23 '17 at 12:10

By default you have an id, is Caption.

If you want to change it, acccording to this answer you have to change from EditorFor to TextBoxFor. To do this, we need to remove new { htmlAttributes because TextBoxFor expects to get htmlAttributes and EditorFor expects to get additionViewData.

@Html.TextBoxFor(model => model.Caption, new { @class = "form-control", @id="myId" } )

I want to mention that your code, as it is, changed the id when i tested.

@Html.EditorFor(model => model.Caption, 
    new { htmlAttributes = new { @class = "form-control", @id="myId" } })

adding css and id selector to input box (razor helper)

2 Answers2