6

I have problem with adding css class to HTML.EditorFor(). I was searching on the net if someone had the same problem but I couldn't find anything.

Can you please help me? So, its not problem about css that class is not defined, it is, but simply, its not added to input field. This is the code in view:

@model eVinogradarstvo.Models.DetaljiViewModel

@{
    ViewBag.Title = "Edit";
}

@using (Html.BeginForm("PromijeniPodatke", "KorisnikDetalji", FormMethod.Post, new { enctype = "multipart/form-data",@class="form-horizontal" }))
{
@Html.AntiForgeryToken()

<div class="col-sm-12">
    @Html.ValidationSummary(true)
    @Html.HiddenFor(model => model.kd.id)
    @Html.HiddenFor(model => model.kd.korisnik_id)
    @Html.HiddenFor(model => model.kd.slika)
    @Html.HiddenFor(model => model.kd.dokument_id)
    <table class="table table-responsive">
        <tr>
            <td>Slika profila</td>
            <td><input type="file" name="uploadImages" class="input-files" /></td>
        </tr>
        <tr>
            <td>@Html.DisplayNameFor(model => model.kd.ime)</td>
            <td>
                @Html.EditorFor(model => model.kd.ime, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.kd.ime)
            </td>
        </tr>
        <tr>
            <td>@Html.DisplayNameFor(model => model.kd.prezime)</td>
            <td>
                @Html.EditorFor(model => model.kd.prezime, new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.kd.prezime)
            </td>
        </tr>
        <tr>
            <td>@Html.DisplayNameFor(model => model.kd.adresa)</td>
            <td>
                @Html.EditorFor(model => model.kd.adresa, new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.kd.adresa)
            </td>
        </tr>
        <tr>
            <td>@Html.DisplayNameFor(model => model.kd.grad)</td>
            <td>
                @Html.EditorFor(model => model.kd.grad)
                @Html.ValidationMessageFor(model => model.kd.grad)
            </td>
        </tr>
        <tr>
            <td>@Html.DisplayNameFor(model => model.kd.drzava)</td>
            <td>
                @Html.EditorFor(model => model.kd.drzava)
                @Html.ValidationMessageFor(model => model.kd.drzava)
            </td>
        </tr>
        <tr>
            <td>@Html.DisplayNameFor(model => model.kd.datum_rodenja)</td>
            <td>
                @Html.EditorFor(model => model.kd.datum_rodenja)
                @Html.ValidationMessageFor(model => model.kd.datum_rodenja)
            </td>
        </tr>
        <tr>
            <td>Mjerna jedinica težine</td>
            <td>
                @Html.DropDownListFor(model => model.kd.mj_tezine, new SelectList(Model.DDLtezina, "vrijednost", "opis"))
                @Html.ValidationMessageFor(model => model.kd.mj_tezine)
            </td>
        </tr>
        <tr>
            <td>Mjerna jedinica tekućine</td>
            <td>
                @Html.DropDownListFor(model => model.kd.mj_tekucine, new SelectList(Model.DDLtekucina, "vrijednost", "opis"))
                @Html.ValidationMessageFor(model => model.kd.mj_tekucine)
            </td>
        </tr>
        <tr>
            <td></td>
            <td><input type="submit" value="Spremi" class="btn btn-default" /></td>
        </tr>
    </table>
</div>

}

Any suggestions?

Veki
  • 117
  • 2
  • 9
  • 1
    See this [http://stackoverflow.com/questions/4576209/asp-net-mvc-3-razor-adding-class-to-editorfor][1] [1]: http://stackoverflow.com/questions/4576209/asp-net-mvc-3-razor-adding-class-to-editorfor – Ali Adravi Jan 13 '15 at 16:05
  • I've already saw this, and my syntax is correct. I've tried everything from there except adding classes with jquery...it doesn't make any sense if I add classes dynamically when this has to work...Maybe it is some kind of bug or something? Or I am missing something... – Veki Jan 13 '15 at 16:10
  • @Veki So you have created a custom editor template as the accepted answer in that question says? Can you add the code for that to your question? – Rhumborl Jan 13 '15 at 16:13
  • Why you are so sticky with EditFor, why cannot use TextBoxFor and everything will work, as you want. – Ali Adravi Jan 13 '15 at 16:17
  • Actually no, because I've found that this is ok syntax, and it must work. That is why I am asking this question. Why it is not working and it should be... – Veki Jan 13 '15 at 16:20
  • Its not that I only want editorfor, I really want to know why it isn't working. Its not problem change it to textboxfor, if this is not going to work, I will change it, but I want to know why... – Veki Jan 13 '15 at 16:26

3 Answers3

7

EditorFor in ASP.NET MVC 3 does not support passing CSS to the generated HTML in this manner. You have to create a custom editor template and pass custom ViewData entries and do it manually (as the linked answers above show).

This was corrected in MVC 5.1, but there is no way to make this work in MVC 3 with EditorFor if you aren't willing to create your own templates.

Erik Funkenbusch
  • 92,674
  • 28
  • 195
  • 291
  • 5.1? Ok, now I know what is the problem, I am on MVC 5.0. Thank you very much, I will see if I am going to upgrade it to make it work, or I will change it to textboxfor. – Veki Jan 13 '15 at 18:34
  • @Veki if you're on MVC 5 why did you mark the question as MVC 3? – Erik Funkenbusch Jan 13 '15 at 18:35
  • Uf, I didn't see that, I was picking what he offered, and I suppose I didn't read good. I will change it now. I am sorry – Veki Jan 13 '15 at 18:37
  • 6
    @Veki - Yes, if you update to MVC 5.1 it will work, however, you will need to use `@Html.EditorFor(model => model.item, new { htmlAttributes = new { @class = "form-control"})`. Note that this is slightly different from the standard syntax. – Erik Funkenbusch Jan 13 '15 at 18:39
  • Aha, ok. I have already found that, you can see it in my code, but it didn't work. Now i know why. Thank you once again. – Veki Jan 13 '15 at 18:46
1

Use TextBox instead of EditFor here special html attributes are not supported, it is only supported from MVC 5. TextBox is should support for MVC 4, I don't know about other version.

@Html.TextBox("test", "", new { @id = "signupform", @class = "form-control", @role = "form",@placeholder="Name" })
Merbin Jo
  • 1,189
  • 1
  • 11
  • 19
1

the easy way is using jquery and add using control id name

$(document).ready(function () {
    $('#LastName').addClass('form-control');
});

Set the class attribute to Html.EditorFor