lundi 29 février 2016

How can I apply a CSS style to Html.CheckBoxFor in MVC 5

This seems like it should be so basic but for the life of me I can't get it working.

In my MVC 5 web app, I would like to show the user a list of layouts using checkboxes so the user can select whichever layouts are required.

I'm using an editor template, that gets called as such:

<table class="table">
<tr>
            <th> 
                @Html.DisplayName("Selected")
            </th>
            <th>
                @Html.DisplayNameFor(x => x.Layout)
            </th>
        </tr>
        @Html.EditorForModel()
</table>

Inside the template I use a helper for the checkbox.

<tr>
    <td>
         @Html.CheckBoxFor(x => x.IsSelected)
    </td>
    <td>    
        @Html.DisplayFor(x => x.Layout)
    </td>
</tr>

This all works fine, I can capture what the user has selected in the Post

What I cannot do however is apply any CSS styles to the checkbox.

What I have read is it should be a matter of:

@Html.CheckBoxFor(x => x.IsSelected, new { @class = "css-checkbox" })

This however causes the checkbox to not be rendered.

I have tried a few things such as wrapping the checkbox in a

<div class="checkbox"> 

but even though the checkbox is rendered, I cannot select any of the items.

Now there is hopefully just something simple I am doing or not doing?

Regards,

Neill




Aucun commentaire:

Enregistrer un commentaire