always v
always v

Reputation: 275

Make a checkbox checked or unchecked based on the value?

How can we make a checkbox checked or unchecked programatically based on the value? That is to say, for a particular user if the value is true, the checkbox should be checked, else if the value is false the checkbox needs to be unchecked. I declared the checkbox in the following way:

<input type="checkbox" class="checkbox">

Upvotes: 26

Views: 113785

Answers (8)

Yasser Shaikh
Yasser Shaikh

Reputation: 47774

if(condition = true)
{
@Html.CheckBoxFor(x => x.Test, new { @checked = "checked" })
}
else
{
@Html.CheckBoxFor(x => x.Test)
}

Hope this helps :)

Upvotes: 27

Prince
Prince

Reputation: 275

if(condition = true)
{
@Html.CheckBoxFor(x => x.Test, new { @checked = true })
}
else
{
@Html.CheckBoxFor(x => x.Test)
}

Upvotes: 1

Raj
Raj

Reputation: 160

try this:

<input type="radio" name="filter_favorites" value="Favorites" @(loggedIn ? "checked" : "") />

So this is a simple radio button which checks loggedIn variable & if true radio button will be checked else not.

Upvotes: 0

ranah
ranah

Reputation: 727

If you do not want to use @Html.CheckBoxFor for whatever reason and you'd like to stick to

         <input type="checkbox"> 

then this is what I found to be the best way to do it:

 <input @(Convert.ToBoolean(Model.YourPropertyHere) == true ?   "checked='checked'" : string.Empty)  type="checkbox" />

The code that @Yasser provided above:

    checked="@(required ? "checked" : "")"

Did not work for me because it was still adding the checked attribute to the element, and setting checked="" will still render the check box as checked, which was not the desired output, instead if you wrap the whole statement into a razor block like so:

     @(Convert.ToBoolean(Model.YourPropertyHere) == true ?   "checked='checked'" : string.Empty)

you will get the desired results.

Upvotes: 34

DavGarcia
DavGarcia

Reputation: 18792

There is a simpler way to include or not include the checked attribute if you are writing our your own <input> instead of using alternatives such as Html.CheckBoxFor:

<input type="checkbox" checked="@isChecked">

Razor is smart enough to automatically generate either

<input type="checkbox" checked="checked">

or

<input type="checkbox">

depending on whether isChecked is true or false. No need for if statements or duplicate code.

Upvotes: 19

Faust
Faust

Reputation: 15394

If you're using MVC and passing in model values correctly from your controller, then

@Html.CheckBoxFor(model => model.checkBox1)

...is all you need. The html-helper does the logic to figure out whether or not to insert the checked="checkbox" code.

Otherwise, without the HTML-helper you can dynamically generate the attribute yourself (others have pointed out how), but don't make the mistake of thinking that checked = "" will leave the box unchecked. See this answer for an explanation.

Upvotes: 2

Umesh
Umesh

Reputation: 2732

If you want to check/uncheck check box value in code-behind, you have to include an ID and runat server attributes in your check box tag.

<checkbox Id="chk" runat="server" class="chkbox"/>

code-behind:

if(yourcondition==true)
  chk.checked = true;
else
  chk.checked = false;

If you want to do it in javascript

<checkbox Id="chk" class="chkbox"/>

JS:

if(yourcondition==true)
  chk.checked = true;
else
  chk.checked = false;

Upvotes: 1

hYk
hYk

Reputation: 789

You have to have a name for the checkbox, eg:

<input name=checkBox1 type="checkbox" class="checkbox">

For functionality :

    if(x==1){
   checkBox1.Checked = true; //To Check
}
else{
   checkBox1.Checked = false // To Uncheck
}

Upvotes: -1

Related Questions