I have a model that can have a variable amount of items in a List<T>
In my view I then have the following:
#using (Html.BeginForm())
{
int count = Model.Data.Filters.Count;
for(int i = 0; i < count; i++)
{
<div>
#Html.TextBox("filtervalue" + i)
#Html.DropDownList("filteroptions"+i,Model.Data.Filters[i].FilterOptions)
</div>
}
#Html.Hidden("LinkID", Url.RequestContext.RouteData.Values["id"])
}
Is there a way in my controller so I can set up the POST action method to bind to a model with variable items in it?
Also how would I construct the model to cope with this?
Thanks
You coud use editor templates, it will be much easier:
#using (Html.BeginForm())
{
#Html.EditorFor(x => x.Data.Filters)
#Html.Hidden("LinkID", Url.RequestContext.RouteData.Values["id"])
}
and inside the editor template (~/View/Shared/EditorTemplates/FilterModel.cshtml) which will be automatically rendered for each element of the Model.Data.Filters collection:
#model FilterModel
<div>
#Html.TextBoxFor(x => x.FilterValue)
#Html.DropDownListFor(x => x.SelectedFilterOption, Model.FilterOptions)
</div>
Now your POST controller action will simply look like this:
[HttpPost]
public ActionResult Foo(SomeViewModel model)
{
// model.Data.Filters will be properly bound here
...
}
Thanks to editor templates you no longer have to write any foreach loops in your views or worry about how to name your input fields, invent some indexed, ... so that the default model binder recognizes them on postback.
Related
This has been a thorn in my side for a while. If I use EditorFor on an array of objects and the editor Template has a form in it ex.
public class FooController:Controller {
public ActionResult Action(Foo foo) {
// ...
}
}
Index.cshtml
#model IEnumerable<Foo>
#Html.EditorFor(m=> m)
EditorTemplate
#model Foo
#using (Html.BeginForm("action", "controller"))
{
#Html.TextBoxFor(f=> f.A)
#Html.CheckBoxFor(f=> f.B)
#Html.LabelFor(f=> f.B)
}
So I'll hit a few problems.
The checkbox label's for doesn't bind correctly to the checkbox (This has to do with the label not receiving the proper name of the property ([0].A as opposed to A).
I'm aware I can get rid of the pre- text by doing a foreach on the model in Index but that screws up ids and naming as the framework doesnt realize there are multiples of the same item and give them the same names.
For the checkboxes I've just been doing it manually as such.
#Html.CheckBoxFor(m => m.A, new {id= Html.NameFor(m => m.A)})
<label for="#Html.NameFor(m => m.A)">A</label>
However I cant solve the inability of the controller to accept the item as a single model. I've even tried allowing an array of Foo's in the Action parameters but that only work when its the first item being edited ([0]...) if its any other item in the array (ex. [1].A) the controller doesn't know how to parse it. Any help would be appreciated.
Make your model a class with the properties you need.
create a class in your Models subfolder
public class MyModel {
public IEnumerable<Foo> Foolist { get ; set;}
public string Something { get;set;}
}
your EditorFor will have to have a foreach loop for Foolist...
MVC will attempt to put your model together from the form and return it to your POST action in the controller.
Edit:
You could create an EditorTemplate for foo. In Views/Shared/EditorTemplates folder, create FooTemplate.cs
#model Foo
<div class="span6 float-left" style="margin-bottom: 6px">
#Html.TextBoxFor(m => m.A, new { style = "width:190px" })
#Html.CheckBoxFor(m => m.B, new { style = "width:40px" })
#Html.ValidationMessage("foo", null, new { #class = "help-inline" })
</div>
then in your view
#foreach (var myFoo in Model)
{
#EditorFor(myFoo)
}
This still suffers from the "model gets passed back as a whole" requiredment of yours. Not sure about why there is a need to process these individually.
Hah finally solved this - Here's how I did it. As a bit of background HTML forms use the name attribute when submitting forms, but the label for element uses Id . so I only adapt the id tag to have the prefix and not the name tag.
--In the cshtml file
#{
var prefix = ViewData.TemplateInfo.HtmlFieldPrefix;
ViewData.TemplateInfo.HtmlFieldPrefix = "";
}
then I can specify the id for the properties by their prefix while letting the name remain the same like so
#Html.CheckBoxFor(m => m.A,
new {id = prefix+"."+ Html.NameFor(m => m.A)})
<label for="#prefix.#Html.NameFor(m => m.A)">A!</label></div>
This question already has answers here:
Post an HTML Table to ADO.NET DataTable
(2 answers)
Closed 7 years ago.
I am displaying a list of items in a Collection in edit mode in a view. after editing the documents, I want to submit. But I am unable to postback the list. List shows null.
here is my View
#model List<NewsLetter.Models.NewsLetterQuestions>
#using (Html.BeginForm("GetAnswersfromUser", "NewsLetter", FormMethod.Post, null))
{
#Html.AntiForgeryToken()
foreach (var item in Model) {
<div>
#Html.DisplayFor(modelItem => item.Question)
</div>
<div>
#Html.TextAreaFor(modelItem => item.Answer)
</div>
}
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Submit" class="btn btn-default" />
</div>
</div>
}
Here is my Controller
public ActionResult GetAnswersfromUser(string id)
{
id = "56c5afc9afb23c2df08dd2bf";
List<NewsLetterQuestions> questions = new List<NewsLetterQuestions>();
var ques = context.NewsLetterQuestionCollection.Find(Query.EQ("NewsLetterId", id));
foreach(var x in ques)
{
questions.Add(x);
}
return PartialView(questions);
}
[HttpPost]
public ActionResult GetAnswersfromUser(List<NewsLetterQuestions> nql)
{
string id = "56c5afc9afb23c2df08dd2bf";
foreach (var item in nql)
{
var query = Query.And(Query.EQ("NewsLetterId", id), Query.EQ("Question", item.Question));
var update=Update<NewsLetterQuestions>
.Set(r => r.Answer, item.Answer);
context.NewsLetterQuestionCollection.Update(query,update);
}
return RedirectToAction("NewsLetterIndex");
}
When i hit submit it throws error.
System.NullReferenceException: Object reference not set to an instance of an object.
In the line
foreach (var item in nql)
which means that nql is null.
In order for the model binder to be able to bind the posted data, all your input names need to be in the format of [N].Property, where N is the index of the item within the list. In order for Razor to generate the input names properly, then, you need to pass it an indexed item, which means you need a for loop, rather than a foreach:
#for (var i = 0; i < Model.Count(); i++)
{
...
#Html.TextAreaFor(m => m[i].Answer)
...
}
You're never passing the list back to the controller's Post handler. You need to route the list back to the controller.
You should be doing something similar to this untested code :)
Html.BeginForm("Index", "Home", new { #nql=Model }, FormMethod.Post)
Take a look at this post as well. It is similar to your issue: Pass multiple parameters in Html.BeginForm MVC4 controller action and this Pass multiple parameters in Html.BeginForm MVC
I have code something like this contrived example in my MVC 4 razor view:
#for (int i = 0; i < Model.NestedModel.Count; i++)
{
#Html.HiddenFor(model => modelModel.NestedModel[i].Id)
#Html.EditorFor(model => Model.NestedModel[i].SomeProperty)
}
In which case everything works fine for me However, I wanted to tidy this up a little as the real world example is a little more involved. So I tried this:
#for (int i = 0; i < Model.NestedModel.Count; i++)
{
var nestedModel = Model.NestedModel[i];
#Html.HiddenFor(model => nestedModel.Id)
#Html.EditorFor(model => nestedModel.SomeProperty)
}
This time the code doesn't appear to bind properly. The rendered html looks the same in terms of name and id attributes that are generated.
Is there any reason why I cannot not assign the nested model to a variable and then use it in this way?
If you inspect the html you are generating you will see that they are not the same. Your first code block generates html like
<input name="NestedModel[0].Id" id="NestedModel_0__Id" .../>
<input name="NestedModel[1].Id" id="NestedModel_1__Id" .../>
The second one will generate html like
<input name="nestedModel.Id" id="nestedModel_Id" .../>
<input name="nestedModel.Id" id="nestedModel_Id" .../>
The second generates invalid html (duplicate id attributes) but more importantly generates a name attribute which has no relationship to your model.
If you wanting to "to tidy this up a little", you should consider using a custom EditorTemplate for the type. For example if the model is
public class MyModel
{
public string SomeProperty { get; set; }
....
}
create a partial in /Views/Shared/EditorTemplates/MyModel.cshtml (note the name must match the name of the type
#model yourAssembly.MyModel
#Html.TextBoxFor(m => m.SomeProperty)
....
and then in the main view you can just use
#Html.EditorFor(m => m.NestedModel)
The EditorFor() method accepts both a single object and IEnumerable<T> and will correctly generate the html for you.
#using (Html.BeginForm("PrintDoorSigns", "TimeTable", FormMethod.Post, new { id = "printDoorSigns" }))
{
<input type="hidden" id="doorSignDate" name="SelectedDate" />
<h3>Door Signs</h3>
<fieldset class="float-left">
<legend>Date</legend>
<div id="signsDate"></div>
</fieldset>
<div id="doorSignsRoomList" class="float-left">
#{Html.RenderAction("DoorSignsForm", new { date = DateTime.Now });}
</div>
<div>
<fieldset>
<legend>Options</legend>
<button id="SelectAllRooms">Select All</button>
<button id="RemoveAllRooms">Remove All</button>
</fieldset>
</div>
}
I have this form which renders this partial view:
#model WebUI.ViewModels.CalendarVM.DoorSignsFormVM
<fieldset>
<legend>Rooms</legend>
#{ var htmlListInfo = new HtmlListInfo(HtmlTag.vertical_columns, 3, null, TextLayout.Default, TemplateIsUsed.No);
if (Model.Rooms.Count() > 0)
{
<div id="roomsWithBookings" class="CheckBoxList float-left">
#Html.CheckBoxList("SelectedRooms", model => model.Rooms, entity => entity.Value, entity => entity.Text, model => model.SelectedRooms, htmlListInfo)
</div>
}
}
</fieldset>
Controller action:
public ActionResult PrintDoorSigns(DateTime SelectedDate, DoorSignsFormVM Model)
when I submit the form, the hidden input "SelectedDate" gets passed back fine and the Model variable which contains two IEnumerable variables isn't null. One of the lists is null which I expect, as it shouldn't be passed back and the SelectedRooms variable which I expect to be populated is a new list with count 0.
I assume the binding is just wrong on this property but I don't understand why, any pointers? Thanks
EDIT:
public PartialViewResult DoorSignsForm(DateTime date)
{
var userID = _bookingService.GetCurrentUser(User.Identity.Name);
var model = new DoorSignsFormVM();
model.Rooms = _sharedService.GetRoomsWithBookings(date, userID.FirstOrDefault().DefSite);
return PartialView("_DoorSigns", model);
}
Here is the doorsignsform action that gets rendered in the form.
As you say, ASP.NET MVC is not recognizing the checkbox values as being part of the DoorSignsFormVM view model.
Given that your SelectedRooms property is a collection of SelectListItems, MVC is not recognizing how to bind the string values from the checkboxes to this property.
Try adding another property called SelectedRoomValues of type string[] to your viewmodel and change your checkbox code to
#Html.CheckBoxListFor(model => model.SelectedRoomValues, model => model.Rooms, entity => entity.Value, entity => entity.Text, model => model.SelectedRooms, htmlListInfo)
MVC will then know how to bind to this new property, which will be populated with the SelectListItem.Value values.
In _Layout.cshtml
#model DynaPortalMVC.Models.Page
#using System.Linq
<ul>
#IEnumerable<model.Page> pages = model.Where(x=>x.CompanyID == 1);
#foreach (var item in pages)
{
<li>item.Title</li>
}
</ul>
In view iam trying to filter the model object called 'page' and get a list of pages whose id is 1. I need to iterate through this to show the menu.
Code inside Controller
public ActionResult Menu(string PageName)
{
//
return View(PageName, db.Pages);
}
Please tell me, how to filter out this model object to a list? I get errors on using IEnumerable.
Solved
I changed the model object to IEnumerable in view page.
#model IEnumerable<DynaPortalMVC.Models.Page>
You can skip assigning the result of your query into an IEnumerable variable unless you will use it somewhere else on the page. So you can just do this:
#model DynaPortalMVC.Models.Page
#using System.Linq
<ul>
#foreach (var item in model.Where(x=>x.CompanyID == 1))
{
<li>#item.Title</li>
}
</ul>
You need
# {IEnumerable<model.Page> pages = Model.Where(x=>x.CompanyID == 1);}
#model IEnumerable<DynaPortalMVC.Models.Page>
#{
ViewBag.Title = "Page";
}