How can I post a model list with gaps from a MVC webpage, and have it preserve those gaps when accessing it in server code?
For example, I want to post this:
<input type="hidden" name="ImageUrl.Index" value="0" />
<input type="url" name="ImageUrl[0]" value="example0.png" />
<!---->
<input type="hidden" name="ImageUrl.Index" value="2" />
<input type="url" name="ImageUrl[2]" value="example2.png" />
And receive this in the controller:
public ActionResult Save(Gallery model)
{
model.ImageUrl[0]; // "example0.png"
model.ImageUrl[1]; // null
model.ImageUrl[2]; // "example2.png"
}
I already noticed the "Index" hidden value helps send gaps correctly, but currently I'm receiving a list with 2 items, not 3. I would rather avoid declaring a dummy hidden value.
Related
I have a ViewModel with rows repeated by using a EditorTemplate
#Html.EditorFor(x => x.Rows)
The HTML generated looks like this (only 1 field in this sample)
<input id="Rows_0__Comment" name="Rows[0].Comment" type="text" value="a" />
<input id="Rows_1__Comment" name="Rows[1].Comment" type="text" value="b" />
<input id="Rows_2__Comment" name="Rows[2].Comment" type="text" value="c" />
This is all fine. But I have a server round trip where some logic removes X rows.
model.Rows = model.Rows.Where(x => x.WhatEver()).ToList();
Now the index based ID strategy used in the HTML render doesn't align with what is posted. So values can be posted to the wrong row.
Can I customize the ID generator to use a ID from my model?
I have a model containing some complex types including nested lists. So I cannot simply use the model.
My initial thought is using knockoutjs to take care of the user interactions (add/delete list items etc.), and post knockoutjs view model via ajax.
But after some googling, I found I could give meaningful name attributes in my form elements and do regular form submit to post my form model like this.
<input checked="checked" data-val="true" data-val-required="The Boolean field is required." name="Questions[0].SubQuestions[0].OptionAnswers[0]" type="checkbox" value="true">
Of course I still need some javascript for list manipulations and stuff.
Which approach is more preferred?
EDIT:
Sorry for the indexing issue. I was aware it should be sequential and start from 0. I just took a random element from my generated html. The indexing is not really my issue. I just would like to know which approach is more preferred.
I start liking the regular form submission way as it takes advantage of the validation feature of DataAnnotations and Html.ValidationSummary. What's the advantages for ajax post?
You are very close to understand the concept how asp.net mvc model binder works out of the box.
This is the link to an article from where I learnt how to achieve similar requirement.
The way that mvc model binder reads in the properties is by looking for parameterName[index].PropertyName. The index must be zero-based and unbroken. Say suppose, if you have your html like below which is a list for example and it can be your Questions list which is a complex type:
<input type="text" name="people[0].FirstName" value="George" />
<input type="text" name="people[0].LastName" value="Washington" />
<input type="text" name="people[1].FirstName" value="Abraham" />
<input type="text" name="people[1].LastName" value="Lincoln" />
<input type="text" name="people[3].FirstName" value="Thomas" />
<input type="text" name="people[3].LastName" value="Jefferson" />
When you submit the above values to asp.net mvc controller, the above value turns into:
people%5B0%5D.FirstName=George&people%5B0%5D.LastName=Washington&people%5B1%5D.FirstName=Abraham&people%5B1%5D.LastName=Lincoln&people%5B3%5D.FirstName=Thomas&people%5B3%5D.LastName=Jefferson
The mvc model binder then read the above data as:
people[0].FirstName = "George"
people[0].LastName = "Washington"
people[1].FirstName = "Abraham"
people[1].LastName = "Lincoln"
people[3].FirstName = "Thomas"
people[3].LastName = "Jefferson"
So, as you can see we have list items for index 0, 1 and then 3. It is broken! This results in mvc model binder only translating this data to a list of type people for only two items i.e. index 0 and 1. It excludes 3 as there was no data at index 2.
this answer has information from the same article. If you understand this, you will understand the role of name attributes and you will appreciate how easy it is to follow the rules and mvc binder will understand all your posted data.
If you want to make sure that mvc binder constructs a list from the posted data even if any index is missing then refer Eric's answer
Yoda's answer is very very good. However there is a known way to have a list of Non-Sequential Indices for postback as Phil Haacked describes in Model Binding To A List (Non-Sequential Indices heading)
<input type="hidden" name="products.Index" value="0" />
<input type="text" name="products[0].Name" value="Beer" />
<input type="text" name="products[0].Price" value="7.32" />
<input type="hidden" name="products.Index" value="1" />
<input type="text" name="products[1].Name" value="Chips" />
<input type="text" name="products[1].Price" value="2.23" />
<input type="hidden" name="products.Index" value="3" />
<input type="text" name="products[3].Name" value="Salsa" />
<input type="text" name="products[3].Price" value="1.23" />
I am modifying an existing asp.net mvc application that creates a list of checkboxes from a list on the model, with property name "MyModelProperty" and additionally generates one more input element for "Select All" which has the following html:
<input name="MyModelProperty_SelectAll" type="checkbox" CHECKED="checked" value=""/>
What is the property declaration in the model that would create a boolean property that would bind to this existing element in the view?
I tried, 'public bool MyModelProperty_SelectAll {get;set;}' but it was returning null. Is that because the value is an empty string in the html input control?
Change your Model property for string:
public string MyModelProperty_SelectAll { get; set; }
Set some value for the checkbox, then in the server, if its checked, the value will be the given value, else you will see null.
<input name="MyModelProperty_SelectAll" type="checkbox" value="all"/>
EDIT:
If you want to bind this to a bool, you must provide a value="true" and a hidden field:
<input class="input-validation-error" id="MyModelProperty_SelectAll" name="MyModelProperty_SelectAll" type="checkbox" value="true">
<input name="MyModelProperty_SelectAll" type="hidden" value="false">
This example code above was generated using the Html.CheckBox helper.
If you don't use MVC htmlhelpers for generating checkboxes you must add an additional hidden element for your checkbox:
<input name="MyModelProperty_SelectAll" type="checkbox" value="true"/>
<input name="MyModelProperty_SelectAll" type="hidden" value="true"/>
I have the following Domains:
class Attribute {
static hasMany = [attributeParameters: AttributeParameter]
}
class AttributeParameter {
String value
Integer sequenceNo
static belongsTo = [attribute: Attribute]
}
I have a form where I want to display all the existing AttributeParameters for an Attribute and allow the user to populate their values and click Save. On Save, each AttributeParameter (which already has an ID) needs to be updated.
I'm currently drawing a blank on how I need to create the HTML for this to work. I've tried this:
Code simplified to clarity:
<form>
<input type="hidden" name="attributeParameters[0].id" value="1" />
<input type="text" name="attributeParameters[0].value" value="1234567" />
<input type="hidden" name="attributeParameters[1].id" value="2" />
<input type="text" name="attributeParameters[1].value" value="name" />
</form>
def save() {
def attribute = Attribute.get(params.id)
attribute.properties = params
}
and it populates the collection correctly, but it doesn't work because the AttributeParameter isn't being fetched before the save, so it is failing with an error:
A collection with cascade="all-delete-orphan" was no longer referenced
by the owning entity instance: com.foo.Attribute.attributeParameters
UPDATE:
I modified the HTML to the following:
<form>
<input type="hidden" name="attributeParameters.id" value="1" />
<input type="text" name="attributeParameters.value" value="1234567" />
<input type="hidden" name="attributeParameters.id" value="2" />
<input type="text" name="attributeParameters.value" value="name" />
</form>
And the controller:
params.list('attributeParameters').each {
def ap = AttributeParameter.get(it.id)
ap.value = it.value
ap.save()
}
This works. My only concern is the order in which the parameters come in. If they always come into the params object in the same order they show up on the form, then I should be ok. but if they ever come in differently, I could be modifying the value of the wrong AttributeParameter.
So still looking for a better way or some sort of verification that they params will always be first in-first out.
UPDATE 2:
I ran across this post and it is what I want but I cannot change Attribute.attributeParameters into a List. They need to stay as a Set.
Could you do something like this:
<form>
<input type="text" name="attributeParameter.1" value="1234567" />
<input type="text" name="attributeParameter.2" value="name" />
</form>
Where you create the names and values dynamically from each AttributeParameter:
<g:textField name="attributeParameter.${attributeParameterInstance.id}" value="${attributeParameterInstance.value}" />
And then in your controller
params.attributeParameter.each {id, val->
def ap = AttributeParameter.get(id)
ap.value = val
ap.save()
}
That way you have the actual id of each parameter directly and it wouldn't matter which order they were processed.
I have a page with a input box and a button, when the user clicks the button i want to redirect to a controller action that has as parameter the value of the input box.
<input id="CodProiect" type="text" />
<input id="Cauta" type="button" value="Cauta" onclick="window.location.href='#Url.Action("Cauta", "Componente", new { CodProiect = "param" })';"/>
How can i get the "param" from the input box ?
You could just use a form with a GET method
<form action="#Url.Action("Cauta", "Componente")" method="GET">
<input id="CodProiect" name="CodProiect" type="text" />
<input id="Cauta" type="submit" value="Cauta" />
</form>
The form will add the parameter as part of the query string of the URL e.g. www.yoursite.com/Cauta/Componente?CodProiect=user+entered+value
Value of the Action is prepared at server side and sent to the browser so you cannot have the value at the server when it is a user input.
You can use jquery to change the URL at client side.
Also passing state in an PRG scenario is a common problem in ASP NET MVC. You can either:
Store it temporarily in session
Pass it as a parameter in URL
Use a form.
Form:
<form action="Componente/Cauta">
<input id="CodProiect" type="text" />
<input id="Cauta" type="submit" value="Cauta" />
</form>
Controller:
public ActionResult Cauta(string CodProiect)
{
//Do some stuff
}
More info: http://weblogs.asp.net/scottgu/archive/2008/09/02/asp-net-mvc-preview-5-and-form-posting-scenarios.aspx
Syntax may be outdated, but you get the point...