Tengo problemas para pasar datos de mi vista a mi controlador. Estoy usando casillas de verificación. Desde mi punto de vista, creé una clase que toma todas mis casillas de verificación (de lunes a viernes) y las coloca en una lista (para que pueda usar los datos en otro lugar). Mi problema es que cuando depuro y hago clic en las casillas de verificación en el sitio web, el código no cambia si hago clic en la casilla de verificación o no, por lo que mi código no reconoce los datos de la casilla de verificación
No estoy seguro si he implementado la vista incorrectamente, ¡pero agradecería cualquier ayuda en la dirección correcta!
Ver modelo:
public List<cDay> _cDays = new List <cDay>(); public List<cDay> cDays { get {return _cDays;} set {_cDays = value;} } public class cDay { public bool Monday { get; set; } public bool Tuesday { get; set; } public bool Wednesday { get; set; } public bool Thursday { get; set; } public bool Friday { get; set; } }
archivo CSHtml:
@Html.Label("M") @Html.CheckBox("Monday", false, new { @class = "availability" }) // this is basically the same code for Tuesday-Friday as well. '<label for="M">M</label> + '<input class="availability" id="Monday" name="Monday" type="checkbox" value="true">' + 'input name="Monday" type="hidden" value="false">' // this is basically the same code for Tuesday-Friday, but the "name" corresponds to each day
Controlador:
[HttpPost] [ValidateAntiForgeryToken] public ActionResult Edit(string inputValue, Model viewModel) { if(ModelState.IsValid) // }
Puedes hacerlo usando jQuery
Agregue un button
debajo de sus casillas de verificación
<input type="button" value="Your_Value" class="btn btn-default" />
Cuando haga clic en un button
, cree una solicitud de publicación y envíe el estado verificado a través de una cadena de querystring
$(document).ready(function () { $("input[type=button]").click(function () { var queryString = 'Monday=' + $("input[name=Monday]").is(":checked") + '&Tuesday=' + $("input[name=Tuesday]").is(":checked") + '&Wednesday=' + $("input[name=Wednesday]").is(":checked") + '&Thursday=' + $("input[name=Thursday]").is(":checked") + '&Friday=' + $("input[name=Friday]").is(":checked"); $.ajax({ type: "Post", url: "/Home/Edit?" + queryString, success: function (data) { }, error: function (data) { } }); }); });
Y dentro del controller
cree Edit Post Method
de publicación de edición como este
[HttpPost] public ActionResult checkboxespost(string Monday, string Tuesday, string Wednesday, string Thursday, string Friday) { ... }
Considere usar el siguiente modelo de datos:
public class DaysViewModel { public List<CDay> Days { get; set; } = new List<CDay>(); } public class CDay { public CDay() { Name = string.Empty; Selected = false; } public CDay(string name) { Name = name; Selected = false; } [Required] public string Name { get; set; } [Required] public bool Selected { get; set; } }
Luego puede usar el enlace de datos ASP.NET MVC predeterminado sin soporte JS:
@model Models.DaysViewModel @using (Html.BeginForm("Edit", "Home")) { @Html.AntiForgeryToken() for(int i=0; i < Model.Days.Count; i++) { <div class="form-group row"> @Html.CheckBox("Days[" + i + "].Selected", Model.Days[i].Selected) @Html.Hidden("Days[" + i + "].Name", Model.Days[i].Name) <span>@Model.Days[i].Name </span> </div> } <input type="submit" value="Save" /> }
Y del lado del servidor:
public ActionResult Edit() { var model = new DaysViewModel(); model.Days.AddRange( new List<CDay> { new CDay("Monday"), new CDay("Tuesday"), new CDay("Wednesday"), new CDay("Thursday"), new CDay("Friday") }); return View(model); } [HttpPost] [ValidateAntiForgeryToken] public ActionResult Edit(List<CDay> days) { if(ModelState.IsValid) { // ... you_code here } var model = new DaysViewModel() { Days = days }; return View(model); }
Capturas de pantalla de prueba
La vista:
En el lado del controlador: