Databases
StackOverflow2013
Postsdbo
POChekbox MVC not Sending back the data. Using Html.Chekboxfor using proto.io not working
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POChekbox MVC not Sending back the data. Using Html.Chekboxfor using proto.io not working
    text
    copied!<p><img src="https://i.stack.imgur.com/IauiG.png" alt="enter image description here">Style which i applied is from hrere : <a href="http://proto.io/freebies/onoff/" rel="nofollow noreferrer">http://proto.io/freebies/onoff/</a></p> <hr> <pre><code>/**** On off flip switch CSS*/ .onoffswitch { position: relative; width: 100px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } .onoffswitch-checkbox { display: none; } .onoffswitch-label { display: block; overflow: hidden; cursor: pointer; border: 0px solid #999999; border-radius: 0px; } .onoffswitch-inner { width: 200%; margin-left: -100%; -moz-transition: margin 0.3s ease-in 0s; -webkit-transition: margin 0.3s ease-in 0s; -o-transition: margin 0.3s ease-in 0s; transition: margin 0.3s ease-in 0s; } .onoffswitch-inner &gt; div { float: left; position: relative; width: 50%; height: 30px; padding: 0; line-height: 30px; font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .onoffswitch-inner .onoffswitch-active { padding-left: 15px; background-color: #C2C2C2; color: #FFFFFF; } .onoffswitch-inner .onoffswitch-inactive { padding-right: 15px; background-color: #C2C2C2; color: #FFFFFF; text-align: right; } .onoffswitch-switch { width: 50px; margin: 0px; text-align: center; border: 0px solid #999999; border-radius: 0px; position: absolute; top: 0; bottom: 0; } .onoffswitch-active .onoffswitch-switch { background: #27CA89; left: 0; } .onoffswitch-inactive .onoffswitch-switch { background: #F23F3F; right: 0; } .onoffswitch-active .onoffswitch-switch:before { content: " "; position: absolute; top: 0; left: 50px; border-style: solid; border-color: #27CA89 transparent transparent #27CA89; border-width: 15px 10px; } .onoffswitch-inactive .onoffswitch-switch:before { content: " "; position: absolute; top: 0; right: 50px; border-style: solid; border-color: transparent #F23F3F #F23F3F transparent; border-width: 15px 10px; } .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner { margin-left: 0; } </code></pre> <hr> <p>View looks like the following</p> <hr> <pre><code>&lt;div class="form-group"&gt; @Html.LabelFor(model =&gt; model.IsLockedOut, new { @class = "col-lg-2 control-label" }) &lt;div class="col-lg-10"&gt; @*@Html.CheckBoxFor( model=&gt; model.IsLockedOut, new {@class="checkbox"}) @Html.ValidationMessageFor(model =&gt; model.IsLockedOut) *@ &lt;div class="onoffswitch"&gt; @Html.CheckBoxFor(model =&gt; model.IsLockedOut, new { @class = "onoffswitch-checkbox" }) @*&lt;input type="checkbox" name="IsLockedOut" class="onoffswitch-checkbox" id="IsLockedOut" data-val="true" value="true" @Html.Raw(Model.IsLockedOut ? "checked=\"checked\"": "") &gt;*@ &lt;label class="onoffswitch-label" for="IsLockedOut"&gt; &lt;div class="onoffswitch-inner"&gt; &lt;div class="onoffswitch-inactive"&gt; &lt;div class="onoffswitch-switch"&gt;&lt;i class="fa fa-lock"&gt;&lt;/i&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class="onoffswitch-active"&gt; &lt;div class="onoffswitch-switch"&gt;&lt;i class="fa fa-unlock"&gt;&lt;/i&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/label&gt; &lt;/div&gt; </code></pre> <h2> </h2> <p>The button dosn't seem to work.</p> <p>I can use the <strong>Input type as checkbox.</strong></p> <p>but when the checkbox is not selected then the value is not comming back in the request object. It makes life difficult.</p> <h2>here is how the controller looks.</h2> <pre><code>[HttpPost] [ValidateAntiForgeryToken] public ActionResult Edit(string UserName, FormCollection formCollection, string[] selectedRoles) { if (string.IsNullOrEmpty(UserName)) { return new HttpStatusCodeResult(HttpStatusCode.BadRequest); } var userToUpdate = db.ApplicationUser.Where(u =&gt; u.Username == UserName).Include(u=&gt; u.Roles).SingleOrDefault(); if (TryUpdateModel(userToUpdate, "", new string[] { "FirstName", "LastName", "Email", "IsLockedOut" })) { try { UpdateRolesForUser(selectedRoles, userToUpdate); db.Entry(userToUpdate).State = EntityState.Modified; db.SaveChanges(); return RedirectToAction("Index"); } catch (Exception ex) { //Todo Put a log message. ModelState.AddModelError("", "Oops... Some thing went wrong." + ex.Message); } } PopulateAssignedRolesData(userToUpdate); return View(userToUpdate); } </code></pre> <hr> <p>Any idea on how to get the checkbox value back in the postback. forcing the form to post the checkbox value down. </p> <p>The model which i am trying to work out is.</p> <pre><code>public class ApplicationUser { [Key] [Required] public String Username { get; set; } [Required] public String Email { get; set; } public String FirstName { get; set; } public String LastName { get; set; } public DateTime? LastActivityDate { get; set; } public DateTime? LastLoginDate { get; set; } public DateTime? CreatedOn { get; set; } public DateTime? UpdatedOn { get; set; } public Boolean IsLockedOut { get; set; } public string LastUpdateBy { get; set; } public virtual ICollection&lt;ApplicationUserRole&gt; Roles { get; set; } } public class ApplicationUserRole { [Key] public int RoleId { get; set; } [Required] public string RoleName { get; set; } public string Description { get; set; } public ICollection&lt;ApplicationUser&gt; Users { get; set; } } </code></pre> <p>Hope more detail helps.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload