I have an object like this
public class Locs
{
public string City {get; set; }
public int Zip {get; set; }
}
public class Names
{
public string FirstName {get; set; }
public string LastName {get; set; }
public Locs[] Locations {get; set; }
}
For the class Names I am generating strongly typed View based on [Create Template]. But when its generated it only show input controls for FristName and Last Name. How can I create a View that can also get Locations from the html page? So that I can easily save data from submit button.
My Form is like this
<input type="text" id="FirstName" name="FirstName" />
<input type="text" id="LastName" name="LastName" />
<p>
<input type="text" id="City1" name="City1" />
<input type="text" id="Zip1" name="Zip1" />
</p>
Add more locations
As you can see User can dynamically create City and Zip. I am now sure how many he will create. How can I get such object in my view? Can i get such object automatically? Also I want to apply validations.
If you are trying to show an editor an for each locations, you can loop through the Locations property in your view:
Rest of your view...
<% for (int i = 0; i < Model.Locations.Count; i++)
{ %>
<%= Html.TextboxFor(model => model.Locations[i].City) %>
<%= Html.TextboxFor(model => model.Locations[i].Zip) %>
}%>
Continue your view.
Related
This question already has answers here:
Post an HTML Table to ADO.NET DataTable
(2 answers)
Closed 4 years ago.
I have a class of Signature objects:
public class Signature
{
public int SignatureID { get; set; }
public int FormID { get; set; }
public string Title { get; set; }
public string Email { get; set; }
[Display(Name = "Signed Date:")]
public DateTime? Date { get; set; }
}
I have a Form.cs class that has a virtual list of signatures
public virtual List<Signature> Signatures { get; set; }
In my controller, I populate the list by:
form.Signatures = repository.Signatures.Where(s => s.FormID == form.FormID).ToList();
In my Form View, I display a list of the associated signatures:
#foreach (var signature in Model.Signatures)
{
<div class="text-center">
<label asp-for="#signature.Title"></label>
<input asp-for="#signature.Title" />
<label asp-for="#signature.Email"></label>
<input asp-for="#signature.Email" />
<label asp-for="#signature.Date"></label>
<input disabled asp-for="#signature.Date">
</div>
}
However, I don't know how to update the associated signatures upon my POST method of the form. For example, if I change the Email property of a signature and POST the form, the model does not bind this change into the Form object. In this case, form.Signatures is null.
How can I ensure changes to the <List>Signature items associated with the form are updated on POST?
Use the for loop to generate the elements, as it would add indexing to the property names which is used by model binder to bind to List on the post which does not work with the foreach:
#for (int i=0; i< Model.Signatures.Count; i++)
{
<div class="text-center">
<label asp-for="#Model.Signatures[i].Title"></label>
<input asp-for="#Model.Signatures[i].Title" />
<label asp-for="#Model.Signatures[i].Email"></label>
<input asp-for="#Model.Signatures[i].Email" />
<label asp-for="#Model.Signatures[i].Date"></label>
<input disabled asp-for="#Model.Signatures[i].Date">
</div>
}
Now the elements would be rendered with names like Signatures[0].Title, Signatures[1].Title and the model binder can bind it to the model on post.
Hope it helps.
Consider a user can create a Sale advertising (Post model). but every advertising have different properties depend on its Group. Properties are not certain and can be added by admin with different constraints(Required. MinLength etc.)
I define a class like this:
public class Property
{
public int Id { get; set; }
public int Priority { get; set; }
[Required()]
public InputType Type { get; set; }
[Required()]
[MaxLength(150)]
public string Title { get; set; }
[Index(IsUnique=true)]
[Required()]
[MaxLength(100)]
public string Values { get; set; }
[MaxLength(100)]
public string Description { get; set; }
public ICollection<GroupProperty> GroupProperties { get; set; }
public ICollection<PostProperty> PostProperties { get; set; }
}
For example admin can add a model's car property to cars group. after that users must fill a model car field for advertisings in car group.
Create view for advertising is like this:
#model IEnumerable<Property>
<section>
<div class="container-fluid">
<div class="row">
<div class="col-md-6">
<h1>New Advertising</h1>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
foreach (var item in Model)
{
#Html.EditorFor(m => item)
}
<button type="submit">hvah</button>
}
</div>
<div class="col-md-6">
</div>
</div>
</div>
</section>
Ah everything goes harder! I have a Editor template for Property class like this:
#model Property
#helper Helper(Property model)
{
switch (model.Type)
{
case WebSite.Models.DomainModels.InputType.NonNegative:
{
<div class="form-group">
<label for="#(model.Name)">#(model.Title)</label>
<span class="field-validation-valid text-danger" data-valmsg-for="#(model.Name)" data-valmsg-replace="true"></span>
<input class="form-control text-box single-line valid" data-val="true"
name="#(model.Name)" type="number" value="0"/>
</div>
return;
}
case WebSite.Models.DomainModels.InputType.RequiredShortString:
{
<div class="form-group">
<label for="#(model.Name)">#(model.Title)</label>
<span class="field-validation-valid text-danger" data-valmsg-for="#(model.Name)" data-valmsg-replace="true"></span>
<input class="form-control text-box single-line" data-val="true"
id="#(model.Name)" name="#(model.Name)" type="text" value="BB"/>
</div>
return;
}
}
}
#Helper(Model)
After all i have Client validation for properties. with hard code i can validate them in server side too. but new problem is Binding! if server side validation goes wrong i need to pass a model to view again. so i am think im doing this with a wrong way. can some one help me? maybe about how solve my problem or a better way to implement this? a simple way to use MVC validation On a complex model like this?
I think you want to create a class and validate ModelState. you can do it like-
Example:
You can pass your model state around like this:
public class MyClass{
public static void errorMessage(ModelStateDictionary ModelState) {
if (something) ModelState.AddModelError("", "Error Message");
}
}
Use in controller:
MyClass.errorMessage(ModelState);
If you need more information about modaestate validation outside then you can fiend more help from this link.
I know there are a lot of posts out there regarding this, most of which I have read and tried all morning but still can't get it working.
I have a view model as such:
namespace GrantTracker.ViewModels
{
public class CoverPageViewModel
{
public List<Compliance> Compliances { get; set; }
}
}
I have a partial view that uses the view model:
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<GrantTracker.ViewModels.CoverPageViewModel>" %>
<%
for (var i = 0; i < Model.Compliances.Count; i++)
{ %>
<%=Html.HiddenFor(x => x.Compliances[i].ComplianceId) %>
<%=Html.TextBoxFor(x => x.Compliances[i].ComplianceName) %>
<% } %>
This properly displays the text boxes and their values:
The generated source looks ok to me:
<input id="Compliances_0__ComplianceId" name="Compliances[0].ComplianceId" type="hidden" value="1" />
<input id="Compliances_0__ComplianceName" name="Compliances[0].ComplianceName" type="text" value="Human Subjects" />
<input id="Compliances_1__ComplianceId" name="Compliances[1].ComplianceId" type="hidden" value="2" />
<input id="Compliances_1__ComplianceName" name="Compliances[1].ComplianceName" type="text" value="Vertebrate Animals" />
<input id="Compliances_2__ComplianceId" name="Compliances[2].ComplianceId" type="hidden" value="3" />
<input id="Compliances_2__ComplianceName" name="Compliances[2].ComplianceName" type="text" value="Hazardous Substances" />
When I submit the page the textbox properties are as far as I can tell properly posted:
Compliances[0].ComplianceId:1
Compliances[0].ComplianceName:Human Subjects
Compliances[1].ComplianceId:2
Compliances[1].ComplianceName:Vertebrate Animals
Compliances[2].ComplianceId:3
Compliances[2].ComplianceName:Hazardous Substances
However, the values are all gone when accessed in the controller action
[HttpPost]
public ActionResult SaveCoverPage(CoverPageViewModel coverPageViewModel)
{
return Content(coverPageViewModel.Compliances[0].ComplianceId.ToString());
}
The debugger shows that it knows it should contain three Compliance objects.
However, when drilled down none of them have their values:
Any help with this would be greatly appreciated. I am really stuck on this.
Change your Compliance class as below.
public class Compliance
{
public int ComplianceId { get; set; }
public string ComplianceName { get; set; }
}
You should define properties correctly.
The problem I currently have is that in my partial view, the checkboxes are not being binded correctly by the MVC framework. The CaseViewModel.IsCaseSelected property will always be false regardless of whether or not the checkbox is selected. However, if I hardcode the html in the parent view instead of rendering a partial, then the CaseViewModel.IsCaseSelected property will be properly set corresponding to the checkboxes.
My code is shown below.
The form in my view looks something like this:
<div class="form-group">
<div>
<label for="ProfileName">Profile Name:</label>
<input type="text" name="ProfileName"><br>
</div>
#Html.Partial("~/Views/Shared/_CasesSelection.cshtml", Model.Cases_Category1)
<div id="category2-cases">
<p>category-2</p>
<label for="select-all">Select all</label>
<input id="select-all" type="checkbox" onclick="select_all_toggle(this)" />
#for (int i = 0; i < Model.Cases_Category2.Count; i++)
{
#Html.Label(Model.Cases_Category2[i].CasesNumber.ToString())
#Html.CheckBoxFor(model => model.Cases_Category2[i].IsCaseSelected)
}
</div>
<div>
<input type="submit" value="Create" class="btn btn-default" />
</div>
My partial view looks like this:
#model List<Models.CaseViewModel>
<div id="some-case">
<p>some-case</p>
<label for="select-all">Select all</label>
<input id="select-all" type="checkbox" onclick="select_all_toggle(this)" />
#for (int i = 0; i < Model.Count; i++)
{
#Html.Label(Model[i].CaseNumber.ToString())
#Html.CheckBoxFor(model => model[i].IsCaseSelected)
}
</div>
The model it is binded to looks like this:
public class TestProfileVM
{
[Required]
[RegularExpression(#"^[a-zA-Z0-9-_]+$")]
public string ProfileName { get; set; }
public List<CaseViewModel> Cases_Category1 { get; set; }
public List<CaseViewModel> Cases_Category2 { get; set; }
}
And finally, CaseViewModel looks like this:
public class CaseVM
{
public string CaseType { get; set; }
public int CaseNumber { get; set; }
public bool IsCaseSelected { get; set; }
}
Additional information:
Additionally, in my parent view, when I replace Model.Cases_Category2[i] with Model.Cases_Category2.ElementAt(i), the binding does not work correctly. What is the reason for this, and could it be related to the original problem? Thanks.
I guess problem is the name of checkbox inside partial view. Hence you pass part of view model to partial page, name of checkbox will generated upon that model which you pass to partial page.
So compare generated name for checkbox inside parent view with the name of checkbox inside partial view and if they are not same, change name of checkbox inside partial page accroding to the name checkbox inside parent page.
So I have a view model call ProductViewModel which has a list of sites where a product can be produced. I am trying to figure out how to show this on a form using a checkbox for the user to select the sites where the product can be produced. Seems straight forward, right? Well it doesn't work like I want/need. Hoping someone can help guide me to the correct way to do this.
My classes:
public class ProductViewModel
{
public List<Sites> SiteList {get; set;}
public string ProductName {get; set;}
public int ProductId {get; set;}
public User ProductOwner{get; set;}
}
public class Sites
{
public int SiteId {get; set;}
public string SiteName {get; set;}
public bool IsSelected {get; set;}
}
Part of my view:
#Html.LabelFor(m=>m.Sites):
#foreach (var site in Model.Sites)
{
#Html.CheckBox("Sites", site.IsSelected, new { value = site.SiteName })
#Html.Label(site.SiteName)
}
When using #Html.Checkbox() I see the following output in the html from the browser:
<input checked="checked" id="Sites" name="Sites" type="checkbox" value="Miami" />
<input name="Sites" type="hidden" value="false" />
I understand the hidden field but what I really need is to get the value for the selected item. So I need to get back the list with Miami in it. I don't need the false/true thing that the html helper seem to want to send (i.e. Miami=true)
So instead I tried this.
#for(int id=0; id < Model.Sites.Count(); id++)
{
<input type="checkbox" id="#Model.Sites[id].SiteName" name="Sites[#id]" value="#Model.BoxingSites[id].SiteName" #(Model.Sites[id].IsSelected ? #"checked=""checked""": "") />
#Html.Label(Model.Sites[id].SiteName)
}
And the output is:
<input type="checkbox" id="Miami" name="Sites[0]" value="Miami" checked="checked" />
<label for="Miami">Miami</label>
In both of these cases I am not able to get the binder to map the form values to the Product.Sites list when posting to the action.
The action is like this:
[HttpPost]
public ActionResult Edit(ProductViewModel Product)
{
//Does something with the form data.
}
The other values (ProductName etc...) map fine.
What am I doing wrong? I feel I am missing something as this should be easier due to how MVC simplifies so many other form handling situations.
Thanks in advance...
How about using an editor template instead of struggling with loops:
#model ProductViewModel
#using (Html.BeginForm())
{
... some other form fields
#Html.LabelFor(x => x.SiteList)
#Html.EditorFor(x => x.SiteList)
<input type="submit" value="Create" />
}
and inside the corresponding editor template ~/Views/Shared/EditorTemplates/Sites.cshtml:
#model Sites
<div>
#Html.HiddenFor(x => x.SiteId)
#Html.CheckBoxFor(x => x.IsSelected)
#Html.LabelFor(x => x.SiteName)
</div>
Now not only that your view code is much more clean but proper names will be generated for the input fields so that the model binder will be able to bind the selected values back in the POST action.
[HttpPost]
public ActionResult Create(ProductViewModel model)
{
...
}
Here is what is working for me.
// View Model
[Display(Name="Boolean Property")]
[UIHint("booleancheckbox"]
public bool? booleanProperty;
View
// View
#Html.EditorFor(m => m.booleanProperty, new { #onclick = "Toggle(this);" })
Editor Template - add some more code to handle null values
// Editor Template booleancheckbox.cshtml
#model bool?
#{
labelText = ViewData.ModelMetadata.DisplayName != null ?
ViewData.ModelMetadata.DisplayName :
ViewData.ModelMetadata.PropertyName;
}
<label for="#ViewData.ModelMetadata.PropertyName">#labelText
#Html.CheckBox(string.Empty, Model.Value, ViewContext.ViewData)
</label>