We Keep Coding

ASP.NET MVC Get checkstate from looped, bound checkboxes

in my journey of learning ASP.NET MVC I encounterd another difficulty:
I'm trying to POST a form with 3 checkboxes, the checkboxes are looped onto the form according to a bound PresentationModel.
I don't know what to fill in at the "asp-for" tag-helpers for the checkboxes in the view so they pass a boolean to the "Create()" ActionResult in the controller and to show the values in the "Overview" View.
Currently it passes NULL for al of them, the other aproaches I tried always resulted in an "InvalidCastException" as it has to be a boolean not an "int[]".
PresentationModel (PMRegistration.cs)
public class PMRegistration
{
public List<Device> Devices { get; set; }
}
View (Index.cshtml)
#model Week3_oef2_ITPro.PresentationModel.PMRegistration
<form asp-controller="Register" asp-action="Create" method="post">
<table>
<tr>
<td>Are you wearing any dangerous accessoires</td>
</tr>
#foreach (var item in Model.Devices)
{
<tr>
<td>#item.Name</td>
<td class="form-group">
<input type="checkbox" asp-for="#item.CheckState" value="#item.Id" class="form-control" />
</td>
</tr>
}
<tr>
<td>
<input type="submit" class="btn btn-default" />
</td>
</tr>
</table>
</form>
Model (Device.cs)
public class Device
{
public int Id { get; set; }
public string Name { get; set; }
public bool CheckState { get; set; }
}
Model (Data.cs, the Device objects get initialized here)
private static List<Device> devices = new List<Device>();
static Data()
{
devices.Add(new Device() { Id = 1, Name = "Laptop" });
devices.Add(new Device() { Id = 2, Name = "Tablet" });
devices.Add(new Device() { Id = 3, Name = "Apple Watch" });
}
public static List<Device> GetDevices()
{
return devices;
}
Controller (RegisterController.cs)
public class RegisterController : Controller
{
// GET: /<controller>/
[HttpGet]
public IActionResult Index()
{
PMRegistration pm = new PMRegistration();
pm.Devices = Data.GetDevices();
return View(pm);
}
public ActionResult Create(PMRegistration pm)
{
if (ModelState.IsValid)
{
return View("Overview", pm);
}
else
{
return RedirectToAction("Index");
}
}
}
------------ SOLVED -------------
With HTML-helpers:
#for (int i = 0; i < Model.Devices.Count; i++)
{
<tr>
<td>
#Model.Devices[i].Name
</td>
<td>
#Html.CheckBoxFor(m => Model.Devices[i].CheckState)
#Html.HiddenFor(m => Model.Devices[i].Id)
#Html.HiddenFor(m => Model.Devices[i].Name)
</td>
</tr>
}

asp.net mvc checkbox + insert data

I have a question. I have a 3 models (Person, RegisteredAddress and AddressCorrespondence) The RegisterAddress and AddressCorrespondence are exactly the same table (with the same names of columns). The Person model is :
public int ID { get; set; }
public string FirstName { get; set; }
public string LastName{ get; set; }
public DateTime BirthDate{ get; set; }
public bool TheSameAddress{ get; set; }
The model of Addresses
public int Id { get; set; }
public string Street{ get; set; }
public int Number{ get; set; }
public string Code{ get; set; }
public string State{ get; set; }
public string City{ get; set; }
public int Person_Id { get; set; }
And then I have a 3 views. Evry view are a form to fill which respons evry model. In first view we can mark the checkBox value of "TheSameAddress" property.
What I want to do is: When the user mark this checkbox then i'd like to open only a view with a RegisteredAddress but i'd like to save the same data into
AddressCorrespondence table.
It's mean that when the checkbox is marked then should be only shown a 2nd form (after 1st) but the 3rd view/form couln't be display but in the database the date should be save.
Does anybody havy any idea how can i make it/solve my problem ?

Option 1
if I understood you can do it like :
in the view :
Person Register View
form design is as you want, you can hide or show the third form if the checkbox is enabled or not
#model WebApplication2.Models.Person
#{
ViewBag.Title = "Register Person";
}
#using (Html.BeginForm())
{
<div class="col-lg-12"><br /></div>
<label>FirstName</label>
#Html.TextBoxFor(m=>m.FirstName)
<div class="col-lg-12"><br /></div>
<label>LastName</label>
#Html.TextBoxFor(m => m.LastName )
<div class="col-lg-12"><br /></div>
<label>The Same Address?</label>
#Html.CheckBoxFor(m=>m.TheSameAddress)
<div class="col-lg-12"><br /></div>
<label>City</label>
<input type="text" name="City"id="City" />
<div class="col-lg-12"><br /></div>
<label>Code</label>
<input type="text" name="Code" id="Code" />
<div class="col-lg-12"><br /></div>
<label>Number</label>
<input type="number" name="Number" id="Number" />
<div class="col-lg-12"><br /></div>
<input type="submit" value="Save" />
}
Controller
compare if the checkbox is true adds the data to RegisteredAddress and AddressCorrespondence else just add data to RegisteredAddress
public ActionResult CreatePeople()
{
return View();
}
[HttpPost]
public ActionResult CreatePeople(Person person,string city,string code , int number)
{
if (person.TheSameAddress == true )
{
var newperson = new Person
{
FirstName = person.FirstName,
LastName = person.LastName,
BirthDate= DateTime.Now,
TheSameAddress=person.TheSameAddress
};
db.person.Add(newperson);
db.SaveChanges();
var newRegisterAdress = new RegisteredAddress
{
City = city,
Code = code,
Number = number,
Person = newperson
};
db.RegisteredAddress.Add(newRegisterAdress);
db.SaveChanges();
var newAdressCorrsp = new AddressCorrespondence
{
City = city,
Code = code,
Number = number,
Person = newperson
};
db.AddressCorrespondence.Add(newAdressCorrsp);
db.SaveChanges();
}
else
{
var newperson = new Person
{
FirstName = person.FirstName,
LastName = person.LastName,
BirthDate = DateTime.Now,
TheSameAddress=person.TheSameAddress
};
db.person.Add(newperson);
var newRegisterAdress = new RegisteredAddress
{
City = city,
Code = code,
Number = number,
Person = newperson
};
db.RegisteredAddress.Add(newRegisterAdress);
db.SaveChanges();
}
return View();
}
it is an idea of how you can do can be adapted to the three views if you want
if you want to asign the data in other view
Option 2
register the person first and asign the adress from index view , Index =People
like:
IndexView
#model IEnumerable<WebApplication2.Models.Person>
#{
ViewBag.Title = "People";
}
<table class="table">
<tr>
<th>
<label>Name</label>
</th>
<th>
<label>LastName</label>
</th>
<th>
<label>BirthDate</label>
</th>
</tr>
#foreach (var item in Model)
{
<tr>
<td>
#Html.DisplayFor(modelItem => item.FirstName )
</td>
<td>
#Html.DisplayFor(modelItem => item.LastName )
</td>
<td>
#Html.DisplayFor(modelItem => item.BirthDate)
</td>
<td>
#Html.ActionLink("Add Adress", "CreateAdress", new { Id_Person = item.ID }, htmlAttributes: new { #class = "btn btn-primary btn-xs" })
</td>
</tr>
}
</table>
Controller
public ActionResult CreateAdress(int Id_Person )
{
ViewBag.PersonId = Id_Person;
return View();
}
[HttpPost]
public ActionResult CreateAdress(RegisteredAddress ra ,int Id_Person)
{
var personf = db.person.Find(Id_Person);
if (personf.TheSameAddress == true)
{
var newRegisterAdress = new RegisteredAddress
{
City = ra.City ,
Code = ra.Code,
Number = ra.Number,
Person = personf
};
db.RegisteredAddress.Add(newRegisterAdress);
db.SaveChanges();
var newAdressCorrsp = new AddressCorrespondence
{
City = ra.City,
Code = ra.Code,
Number = ra.Number,
Person = personf
};
db.AddressCorrespondence.Add(newAdressCorrsp);
db.SaveChanges();
}
else
{
var newRegisterAdress = new RegisteredAddress
{
City = ra.City,
Code = ra.Code,
Number = ra.Number,
Person = personf
};
db.RegisteredAddress.Add(newRegisterAdress);
db.SaveChanges();
}
return RedirectToAction("People");
}
I leave a link with the project here

Should I use ViewBag to pass a list to a View?

Not sure why I got down voted but I'm going to re-write my question after doing some research and testing. This is a side project that I'm using to learn MVC/EF/Repository/Bootstrap etc. I only get a couple hours here a few nights a week to work on it.
Basic original question:
I know I should really be using a List<> in a ViewModel to pass the data to the View but I'm not sure how or if it will meet my requirement.
What I am trying to do is get a list of users to display in a table which would have a checkbox in each row. Above that table I want to have a list of Groups to that they could be assigned to. You select the section from the DropDownList (DDL) and then check who you want to assign it to. It's the groups/sections that I want want to assign as a list and pass to the View.
So, I've got a ViewModel with a list and I'm using a repository to populate the VM. What I don't know how to do exactly is where/when to populate that list with each VM object and even if I do and there are say 50 users I wouldn't want to make 50 trips to the DB to pull the same information.That is why I'm thinking that for this scenario using the ViewBag to pass that Group list to the View might be justifiable. On the flip side I would like to learn how to populate that list properly in the VM for future coding.
Updated question/code:
So, after more research and following some suggestions I've now got the following code. I'm still not sure how I will properly populate my Patrols in my ViewModel in order to populate the DDL in my View.
At the moment I've got the View displaying the table with the checkboxes. Now I'm back to working on getting the values to populate the DDL and then I'll have to work on posting to the controller, looping to find the check rows, and updating the database. In my case each member record is defaulted to a PatrolId=0 and this page should allow me to update the PatrolId to a value from the DDL.
The Patrols property in the PatrolMemberViewModel should be a list of about 5 records that I would pull from a DB table instead of hard coding in the DDL.
ViewModel:
public class PatrolViewModel
{
public int PatrolId { get; set; }
public string PatrolName { get; set; }
}
public class PatrolMemberViewModel
{
[Key]
public int MemberId { get; set; }
public int PatrolId { get; set; }
[Display(Name = "First Name")]
public string FirstName { get; set; }
[Display(Name = "Last Name")]
public string LastName { get; set; }
[Display(Name = "Phone")]
public string PhonePrimary { get; set; }
[Display(Name = "Email")]
public string EmailPrimary { get; set; }
public bool IsSelected { get; set; }
public PatrolViewModel Patrols { get; set; }
}
Controller:
public ViewResult Unassigned()
{
try
{
IEnumerable<PatrolMemberViewModel> model = repository.SelectAllUnassigned();
return View(model);
}
catch (Exception)
{
ModelState.AddModelError(string.Empty, "Error retrieving the record.");
return View();
}
}
Repository:
public IEnumerable<PatrolMemberViewModel> SelectAllUnassigned()
{
using (DataContext db = new DataContext())
{
var results = (from p in db.Person
where p.IsActive == true
&& p.IsScout == true
&& p.PatrolId == 0
select new PatrolMemberViewModel
{
MemberId = p.PID,
FirstName = p.FirstName ?? string.Empty,
LastName = p.LastName ?? string.Empty,
EmailPrimary = p.EmailPrimary ?? string.Empty,
PhonePrimary = p.PhonePrimary ?? string.Empty,
PatrolId = p.PatrolId,
IsSelected = false
}
).OrderBy(o => o.LastName).ThenBy(o => o.FirstName).ToList();
return results;
}
}
View:
#model IList<ProjectName.ViewModels.PatrolMemberViewModel>
#{
ViewBag.Title = "Unassigned";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Patrols</h2>
#using (Html.BeginForm("Update", "Patrol", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
#Html.AntiForgeryToken()
#Html.ValidationSummary(false, "", new { #class = "alert alert-danger" })
<table class="table table-bordered table-striped table-hover table-condensed tbackground">
<tr>
<th class="text-center">
</th>
<th class="text-center">
First Name
</th>
<th class="text-center">
Last Name
</th>
<th class="text-center">
Email
</th>
<th class="text-center">
Phone
</th>
</tr>
#for (var i = 0; i < Model.Count(); i++)
{
<tr>
<td class="text-center">
#Html.CheckBoxFor(m => m[i].IsSelected)
</td>
<td>
#Html.DisplayFor(m => m[i].FirstName)
</td>
<td>
#Html.DisplayFor(m => m[i].LastName)
</td>
<td>
#Model[i].EmailPrimary
</td>
<td class="text-center">
#Html.DisplayFor(m => m[i].PhonePrimary)
</td>
</tr>
}
</table>
<div class="control-wrapper">
<input type="submit" id="btnSubmit" value="Assign" class="btn btn-success" />
</div>
}
<p> </p>

Start by creating the view models to represent what you want to display/edit in the view. Your PatrolMemberViewModel can be used but remove the [Key] attribute and the int PatrolId and PatrolViewModel Patrols properties.
Then create the parent view model
public class AssignPatrolViewModel
{
[Display(Name = "Patrol")]
[Required(ErrorMessage = "Please select a patrol")]
public int? SelectedPatrol { get; set; }
public IEnumerable<SelectListItem> PatrolList { get; set; }
public List<PatrolMemberViewModel> Members { get; set; }
}
and you GET method would be
public ViewResult Unassigned()
{
var model = new AssignPatrolViewModel
{
PatrolList = new SelectList(db.Patrols, "PatrolId", "PatrolName"), // modify to suit
Members = repository.SelectAllUnassigned().ToList()
};
return View(model);
}
and in the view
#model AssignPatrolViewModel
....
#using (Html.BeginForm())
{
#Html.LabelFor(m => m.SelectedPatrol)
#Html.DropDownListFor(m => m.SelectedPatrol, Model.PatrolList, "Please select")
#Html.ValidationMessageFor(m => m.SelectedPatrol)
<table>
.... // thead elements
<tbody>
#for(int i = 0; i < Model.Members.Count; i++)
{
<tr>
<td>
#Html.CheckBoxFor(m => m.Members[i].IsSelected)
#Html.HiddenFor(m => m.Members[i].MemberId)
// add other hidden inputs for properties you want to post
</td>
<td>#Html.DisplayFor(m => m.Members[i].FirstName)</td>
....
</tr>
}
</tbody>
</table>
<input type="submit" value="Assign" class="btn btn-success" />
}
Then in the POST method
[HttpPost]
public ViewResult Unassigned(AssignPatrolViewModel model)
{
if (!ModelState.IsValid)
{
model.PatrolList = new SelectList(db.Patrols, "PatrolId", "PatrolName");
return View(model);
}
// Get selected ID's
IEnumerable<int> selected = model.Members.Where(m => m.IsSelected).Select(m => m.MemberId);
// Get matching data models
var members = db.Person.Where(p => selected.Contains(p.PID)); // modify to suit
// loop each each member, update its PatrolId to the value of model.SelectedPatrol
// save and redirect
}

You could create a new class for your view model, with the list of users and the list of sections as properties within it. Some people seem to like that approach.
But I think your use of ViewBag for passing the list of sections is perfectly valid. I do that all the time for DDLs like this.

Sent checked html table view back to client when invalid

When my Model.State is NOT valid I want to return the view WITH the checked checkboxes.
How would you change my code? Is it possible at all with my approach?
VIEW
#model ListTest.Models.PeopleListViewModel
#{
var hasMoreThanOnePerson = #Model.People.Count > 1;
}
#Html.BeginForm("Save", "Home")
{
#Html.ValidationSummary(false)
<table>
#foreach (var item in Model.People)
{
<tr>
#if (hasMoreThanOnePerson)
{
<td>
<input type="checkbox" name="SelectedIds" value="#item.PersonId" />
</td>
}
else
{
#Html.Hidden("SelectedIds", item.PersonId)
}
<td>
<input type="text" value="#item.Name" />
</td>
</tr>
}
</table>
<input type="submit" value="Save" />
}
VIEWMODEL
public class PeopleListViewModel
{
public PeopleListViewModel()
{
SelectedIds = new int[] { };
}
[MinLength(1, ErrorMessage = "Minimum one person must be selected!")]
public int[] SelectedIds { get; set; }
public List<Person> People { get; set; }
}
CONTROLLER
public ActionResult Index()
{
var people = new List<Person> {
new Person { Name = "Horst", PersonId = 10 },
new Person { Name = "Michael", PersonId = 20}
};
return View(new PeopleListViewModel { People = people });
}
[HttpPost]
public ActionResult Save(PeopleListViewModel viewModel)
{
if (ModelState.IsValid)
{
}
viewModel.People = new List<Person> { new Person { Name = "Horst", PersonId = 10 }, new Person { Name = "bernarnd", PersonId = 20 } };
return View("Index", viewModel);
}

Few things to change
Firstly, change your People model to include an IsSelected property, we want to do away with your SelectedIds method
Secondly, in order to post the data from the client, we need to rewrite your foreach to be a for so the fields are indexed correctly, we'll also add some extra HiddenFors for the properties that you want to keep (because we're no longer re-populating your model when validation fails), your table will be:
<table>
#for (int i = 0; i < Model.People.Count; i++)
{
<tr>
#Html.HiddenFor(m => m.People[i].PersonID)
#Html.HiddenFor(m => m.People[i].Name)
#if (hasMoreThanOnePerson)
{
<td>
#Html.CheckBoxFor(m => m.People[i].IsSelected)
</td>
}
else
{
#Html.HiddenFor(m => m.People[i].IsSelected)
}
<td>
<input type="text" value="#Model.People[i].Name" />
</td>
</tr>
}
</table>
Finally, we don't reassign your People list in your action method if validation fails just return the model that was passed in. If you want to get the selected people, use the code I've added below. Also, because we don't have the SelectedIds anymore we can perform our own validation:
[HttpPost]
public ActionResult Save(PeopleListViewModel viewModel)
{
List<People> selected = viewModel.People
.Where(p => p.IsSelected)
.ToList();
if (selected.Any())
{
//it's valid
List<int> selectedIds = selected
.Select(s => s.PersonID)
.ToList();
}
return View("Index", viewModel);
}

model is null when trying to get data from view to controller

I have a module which send data from controller to view. it has multiple rows and it shows correctly as i wanted. now after making some changes by user i am trying again to save changes in database with the help of actionresult. but when i try to fetch values it say my model is empty/null but it's not ...i am not getting what is the issue...Thanks in advance...
Here is my model:
public class ManageAppsModel
{
public string appname { get; set; }
public int id { get; set; }
public bool chkbillboard { get; set; }
}
Here is my view:
#model IEnumerable<Nd.Models.ManageAppsModel>
#using (Html.BeginForm(null, null, FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<br />
<h2 style="color:#80afdd;font-size:14px;">
<strong> List of Existing Apps:</strong>
</h2>
<br />
<div class="section-copy">
<table>
#foreach (var item in Model)
{
<tr>
#if (Context.User.Identity.Name == "admin")
{
<td style="width:50px;">
#if (#item.chkbillboard == true)
{
<input name ="chk1" class="myCheckbox" type="checkbox" value="#item.chkbillboard" checked="checked" />
}
else
{
<input name ="chk2" class="myCheckbox" id="chkbox" type="checkbox" value="#item.chkbillboard" onclick="return chkbox();" />
}
</td>
}
<td style="width:200px;">
#item.appname
</td>
<td style="width:50px;">
#Html.ActionLink("Edit", "UpdateAPIForm", new { #id = item.id, appname = item.appname })
</td>
</tr>
}
</table>
</div>
<br/><br/>
if (Context.User.Identity.Name == "admin")
{
<div>
<input type="submit" name="Upload" value="Upload new flash info message" />
</div>
}
}
Here is my actionresult:
[Authorize]
public ActionResult ManageApps(String username)
{
var a = HttpContext.User.Identity.Name;
var context = new ndCorp_SiteEntities();
if (a == "admin")
{
var viewModel1 = from dc in context.DevContactInfoes
join dm in context.DevMarketplaceInfoes on dc.AppName equals dm.AppName
select new ManageAppsModel { appname = dc.AppName, id = dc.SNo, chkbillboard = dc.billboard.Value }
;
return View( viewModel1 );
}
else
{
var viewModel = from du in context.DevUserInfoes
join dc in context.DevContactInfoes on du.UserName equals dc.UserName
join dm in context.DevMarketplaceInfoes on dc.AppName equals dm.AppName
where du.UserName == a
select new ManageAppsModel { appname = dc.AppName, id = dc.SNo };
return View(viewModel);
}
}
[Authorize]
[HttpPost]
public ActionResult ManageApps(IEnumerable<ManageAppsModel> apps)
{
var user = HttpContext.User.Identity.Name;
var context = new ndCorp_SiteEntities();
foreach (var ManageAppsModel in apps)
{
if (ManageAppsModel.chkbillboard == true)
{
Response.Write("hello");
}
}
return RedirectToAction("ManageApps", new { username = user });
}

Your checkboxes are named chk1 and chk2, but your field is called chkBillboard. When you post your value, it uses the names of the input fields to match up the field names in your model.
I suggest using a helper, which makes sure you have the correct format.
#Html.CheckBoxFor(x => item.chkBillboard, new { #class="myCheckbox" })