Search code examples
cssasp.net-mvchtml-helper

MVC: which CSS class implements Html.EditorFor() method?


In order to modify the style shown when you use @Html.EditorFor(m => m.SomeAttribute) I want to know how to override the default CSS class without declare a new class for each attribute data type of the model. In other words.

I don't want to do this:

  @Html.LabelFor(m => m.ddlStationId, new {@class="label"})
  @Html.EditorFor(m => m.ddlStationId, new { ReadMethod = "Read", ReadController = "Receiver",@class="combobox" })
  @Html.EditorFor(m => m.txbBrandName,new {@class="textbox"})

As you all know, EditorFor() has a different behavior depending on the datatype, so I want to know where is located this class.

I did something by using the UIHint class as a decorator and defined an EditorTemplate, but doesn't allowed me to override the main CSS. Is important to say that I'm using the Kendo UI framework. Some extra information which can be relevant.


Solution

  • Thanks tommy! I did something like this, but using UIhint... so, when I declared a property I set some decorators depending on the data type and there I used the Css Class. For example:

    [Required]
    [Display(Name = "Nombre")]
    [UIHint("String")]
    public string txbName
    {
        get;
        set;
    }
    

    And, on the Editor Template:

    @model object 
    
    @Html.TextBoxFor(model => model, new {@class="k-textbox",style="min-width:200px;" })
    

    Finally, the definition of the CSS class "k-textbox"

    .controls-row .k-textbox {
        margin: 0 auto;
        clear: left;
        display: inline-block;
    }
    

    I preffer this solution because allows me apply this markup for all textbox in the solution... for my particular case is what I wanted to do:

    <div class="controls-row">
         @Html.LabelFor(model => model.txbName) //it shows "Nombre"
         @Html.EditorFor(m => m.txbName) //it declares an editor for string type
    </div>
    

    Thanks for answering! :)