CODEWITHSUNDEEP
razorasp.net-mvc-4
Abdur Rahim
Abdur Rahim

Reputation: 4021

Showing text for checkboxfor in razorview

USING ASP .Net MVC 4 , Razor View

I have a CheckBoxFor:

    <div class="editor-checkbox-field">
        @Html.CheckBoxFor(model => model.Is2ndMailBody, new { @name = "secMailBody", @id = "secMailBody", @class = "secMailBody", @onclick = "disable(this.form.secMailBody)", @value = "Create Table", @text = "Create Table" })
    </div>

But the CheckBox itself is showing. How can i show a text what the CheckBox for?

my model has :

public bool IsChecked { get; set; }

javascript is working fine and css also. I just want to know how i can show a text for this checkbox?

EDIT 1 :

This is what is showing

I want the text Create Second Mail Body in the right side of the check box.

Upvotes: 10

Views: 45636

Answers (6)

Abdur Rahim
Abdur Rahim

Reputation: 4021

Answer 1: Just put the string right after the CheckBox like below.

<div class="checkbox">
    <label>
        @Html.CheckBoxFor(m => m.Is2ndMailBody) Create Second Mail Body

    </label>
</div>

Answer 2: In Model,

[Display(Name = "Create Second Mail Body")]
public bool Is2ndMailBody{ get; set; }

In View

<div>
    @Html.CheckBoxFor(m => m.IsChecked)
    @Html.LabelFor(m => m.Is2ndMailBody)
</div>

Upvotes: 18

Peck_conyon
Peck_conyon

Reputation: 241

In your model class use Data Annotations to give a display name to the property

You need to have this using statement on top of the model class

using System.ComponentModel.DataAnnotations;

Then set the Display Name attribute 

[Display(Name = "Create second mail body")]
public bool IsChecked { get; set; }

After that in your view use wrap the checkbox with the following div tag. You will need to have bootstrap CSS referenced in the view if it's not

<div class="checkbox">
    @Html.CheckBoxFor(m => m.Is2ndMailBody, new { htmlAttributes = new { @class = "form-control" } })
    @Html.LabelFor(m => m.Is2ndMailBody, new { @class = "control-label" })
</div>

Hope this will help

Upvotes: 2

odyth
odyth

Reputation: 4336

If you are using bootstrap you can do this

<div class="checkbox">
    <label>
        @Html.CheckBoxFor(m => m.Is2ndMailBody) Create Second Mail Body
        @Html.ValidationMessageFor(m => m.Is2ndMailBody)
    </label>
</div>

example from: http://getbootstrap.com/css/

Upvotes: 3

Ryan
Ryan

Reputation: 467

You can use 

@Html.DisplayNameFor

instead of

@Html.LabelFor

in Alizra's answer. This way, .label css style won't be applied to your text.

Upvotes: 6

Engineer M Sajjad
Engineer M Sajjad

Reputation: 251

You can try this:

<div class="editor-checkbox-field">
<label> Create Second Mail Body @Html.CheckBoxFor(model => model.Is2ndMailBody, new { @name = "secMailBody", @id = "secMailBody", @class = "secMailBody", @onclick = "disable(this.form.secMailBody)", @value = "Create Table", @text = "Create Table" }) </label>
</div>

That is:

    <label> Your text @HTML.checkBoxFor() </label>

Upvotes: 0

AliRıza Adıyahşi
AliRıza Adıyahşi

Reputation: 15866

First add filter to your model that called DisplayAttribute

[Display(Name = "Some Text")]
public bool IsChecked { get; set; }

And you can use Label for model

@Html.LabelFor(model => model.Is2ndMailBody)

Upvotes: 6

Related Questions