I have a dictionary property called Week:
public IDictionary<DayOfWeek, Day> Week { get; private set; }
And I'm trying to pass its values off to HiddenFor (Days)
#Html.HiddenFor(x => x.Week.Values)
It has to be a property of the Model so I can't do x.Week.Values.ToList();
How would I go about passing the Dictionary Values to the Html.HiddenFor?
Well since your using HiddenFor, I'm going to assume that you need to rebind the values of the dictionary on form post. To bind a Dictionary to the view, your going to need to do something like this:
#foreach (var key in Model.Week.Keys)
{
Html.DisplayFor(model=>model.Week[key]);
}
Each value in the dictionary will be given its own Hidden Input field, with the name attribute:
name="Week.{key here}
If, on the other hand, all you need to do is send the data in your model to the client so that you can do something with it in JavaScript, you might want to look at writing it to the page as JSON.
<script type="text/javascript">
#Html.Raw(Json.Encode(Model.Week))
</script>
I would use:
#foreach (var key in Model.Week.Keys)
{
#Html.HiddenFor(model=>model.Week[key]);
}
The '#' before the Html seems necessary for razor to output the hidden fields.
It outputs something like this for each key:
<input data-val="true" data-val-number="The field Int32 must be a number."
data-val-required="The Int32 field is required." id="Week_5_" name="Week[5]"
type="hidden" value="3">
Related
I am working on a blazor project currenty. In this project I need to add some default values to a list in my C# code. The problem is that I can not find a way to bind a boolean method return value to the "checked" attribute of an input.
Code:
I do have a list and I am adding an input (checkbox) field per entry in this list to my html:
#foreach (ProfessionViewModel prof in Professions)
{
<div class="form-group m-1">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="#prof.Id"
#onchange="eventArgs => { ToggleProfessions(prof, eventArgs.Value); }" />
</div>
</div>
}
I cant find a way to bind the "checked" attribute to a method that checks if this item exists in an other list (SelectedProfessions list, defined in #code section).
My list:
public List<ProfessionViewModel> SelectedProfessions { get; set; } = new List<ProfessionViewModel>();
My boolean return method:
private bool CheckIfProfessionIsAssigned(ProfessionViewModel prof)
{
if (SelectedProfessions.Contains(prof))
return true;
return false;
}
Problem description:
The collection "Professions" contains all professions available in the app. In this form the user should be able to select certain professions individualy (for a profession filter).
Every selected profession is contained in the collection "SelectedProfessions". The problem is that I can't bind (or render) the checkboxes value according to the helper property "CheckIfProfessionIsAssigned", which determines if this profession is currently selected by the user.
Didn't try these myself, but based on this answer - https://stackoverflow.com/a/60343185 - something like this might work to initially check the checkboxes:
<input type="checkbox" checked="#CheckIfProfessionIsAssigned(prof)">
You could alternatively try to create a dictionary of integers and booleans named professionsSelected in which to store for each profession ID if it is selected or not, and then bind that to the checkboxes, like:
<input type="checkbox" #bind="#professionsSelected[prof.Id]" />
I have model property int? CaseId
public class TaskDetailsVm
{
public TaskDetailsVm(Task task)
{
CaseId = task.CaseID;
}
public int? CaseId { get; set; }
}
and on view:
#Html.HiddenFor(x => x.CaseId) => 0
#Html.Hidden("CaseId", Model.CaseId) => 0
#Html.Hidden("qwe", Model.CaseId) => real value
<input type="hidden" id="CaseId" name="CaseId" value="#Model.CaseId" /> => real value
in browser I see this:
<input data-val="true" data-val-number="The field CaseId must be a number." id="CaseId" name="CaseId" type="hidden" value="0">
<input id="CaseId" name="CaseId" type="hidden" value="0">
<input id="qwe" name="qwe" type="hidden" value="22906">
<input type="hidden" id="CaseId" name="CaseId" value="22906">
Why can I see the following? I don't see any scripts to override this value. And how can I resolve it?
Also for first line of code I see additional attributes data-val="true" and data-val-number="The field CaseId must be a number." for some reasons that I can't understand.
This has to do with the ModelState. As per this article:
ASP.NET MVC assumes that if you’re rendering a View in response to an HTTP POST, and you’re using the Html Helpers, then you are most likely to be re-displaying a form that has failed validation. Therefore, the Html Helpers actually check in ModelState for the value to display in a field before they look in the Model. This enables them to redisplay erroneous data that was entered by the user, and a matching error message if needed. Since our [HttpPost] overload of Index relies on Model Binding to parse the POST data, ModelState has automatically been populated with the values of the fields. In our action we change the Model data (not the ModelState), but the Html Helpers (i.e. Html.Hidden and Html.TextBox) check ModelState first… and so display the values that were received by the action, not those we modified.
Now in this case: #Html.HiddenFor(x => x.CaseId, new {Value = #Model.CaseId}), since you are explicitly defining a value for the current Model, it displays the value that you expect. You can use ModelState.Clear(); in your Controller after your POST on the form to reset the model values.
I have a form:
#using (Html.BeginForm("QuoteUpdate", "Home", FormMethod.Post))
{
#Html.DropDownList("network", Model.availableNetworks);
#Html.DropDownList("grade", Model.grades);
#Html.HiddenFor(o => o.Product.id);
<button type="submit">Get Quote</button>
}
And a controller:
[HttpPost]
public ActionResult QuoteUpdate(int? id, string network, string grade )
{
}
The id property is always null after form is submitted. I have checked source and the hidden field has the correct value in the rendered HTML.
I cannot figure out why this parameter is always null. What am I missing?
Since you're accessing a nested property on your model, the generated HTML is probably something like this:
<input type="hidden" id="Product_id" name="Product.id" />
When your form gets posted to the controller action, there's not a parameter that matches up with Product.Id.
You could work around this by changing the generated name of the input (see this answer for more about how to do that):
#Html.HiddenFor(o => o.Product.id, new { Name = "id" });
Which will generate:
<input type="hidden" id="Product_id" name="id" />
Then things should model bind correctly.
I have a model with one of the property of type object . This property is a dynamic property and could sometime contain a string or a date or a Boolean.
I have a editor template for each type i.e boolean , string , date etc .
The problem I have is when the page is posted , the postback contains a array instead of the actual value. The first element of the array contains the actual value.
Why is the value being returned as a array ?
My model
public string Description;
public string Name { get; set; }
public Type Type{ get; set; }
object _value;
public object Value { get;set;}
statement in the view
#Html.EditorFor( m => m.Value)
Edit : Corrected the object name from _value to Value. It was a wrong Ctrl V operation.
Edit : The HTML rendered in the browser
When the object contain a boolean value (checkbox):
<div>
<input checked="checked" data-val="true" data-val-required="The BoolJPY field is required." id="FurtherInformationFieldObject_Properties_1__Value" name="FurtherInformationFieldObject.Properties[1].Value" type="checkbox" value="true"><input name="FurtherInformationFieldObject.Properties[1].Value" type="hidden" value="false">
When the object contains a string(Textbox) :
<div id="divStringField"><input class="text-box single-line valid" data-val="true" data-val-required="The String Field field is required." id="FurtherInformationFieldObject_Properties_2__Value" name="FurtherInformationFieldObject.Properties[2].Value" type="text" value=""> </div>
Edit 2 : Posting the complete model and view code.
Controller code :
public ActionResult Edit(string name ="field1" )
{
Models.DynamicData data1 = new Models.DynamicData();
//all this comes from the database table. I am putting the value directly in field just for simplicity
// this is exactly how I convert the value from the entity to the model
data1.Description = "Field1 Description";
data1.Name = "field1";
data1.Type = typeof(string);
data1.Value = Convert.ChangeType("MyStringValue", data1.Type);
//similarly add few more fields to the model collection
return View(data1);
}
[HttpPost]
public ActionResult Edit(Models.DynamicData model)
{
// break point here : model.Value shows a array of string instead of the edited value.
return View(model);
}
View :
#model SampleDynamicDataProject.Models.DynamicData
#{
ViewBag.Title = "Edit";
}
<h2>Edit</h2>
#using (Html.BeginForm()) {
#Html.AntiForgeryToken()
#Html.ValidationSummary(true)
<fieldset>
<legend>DynamicData</legend>
<div class="editor-label">
#Model.Description
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Value)
#Html.ValidationMessageFor(model => model.Value)
</div>
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
}
I should explain I used object as type for Value property because the value could be string or bool or date ex data1 in above controller could look like below
data1.Description = "Field2 Description";
data1.Name = "field2";
data1.Type = typeof(bool);
data1.Value = Convert.ChangeType("true", data1.Type); // database stores "true" as string which is converted into a boolean and stored in the object.
As shown in the code , my problem is in the post action for Edit , I get Value as an array even for a simple string.
The sample project code here https://drive.google.com/file/d/0B3xCaeRk2IQZSTM0aHdoWEtNYW8/edit?usp=sharing
I got a answer to my question at one of the other forums.
Basically the reason MVC binder is returning a array is because it does not understand what type of data/control is used in the html and the model binder fails.
I got around my issue by modifying the model to have two different property a
public String StringValue
public Bool BooleanValue
I use the StringValue field when the Type is String , Date , Number etc.
I use the BooleanValue for field with Type as Boolean.
Its not the cleanest approach but it will have to do till the point I write my own custom model binder.
Thanks to bruce who answered my question here http://forums.asp.net/p/1961776/5605374.aspx?Re+MVC+4+Postback+returns+a+array+for+property+of+type+object+in+my+model
I now understand why the model binder fails.
Pasting his answer here for the benefit of others
you need to understand how browser postback is done. on form submit a collection of name/value pairs is sent. the name is the form element name, the value is the elements value. standard url encoding is done. so for:
the postdata is
foo=1&bar=true
note the post data is just a string with no type data. the brwser allows duplicate name, so
the post data is:
foo=1&foo=true
when asp.net load the post data into the form collection (which is just a dictionary), it can not add the key "foo" twice, but concats the values seperated by a "," ("1,true"). the binder just treats it as a string array named foo with 2 values.
now we get to another browser behavior. form elements that support checked (radio and checkbox) are only include the post data if checked. this causes a problem for the mvc binder with checkbox, becuase it can not tell from the postback data if the element was not checked or not included. this is important if you are using tryupdate to apply only a subset of the model properties, becuase only a subset was rendered. to get around this, the checkbox helper renders two fields with the same name, a hidden with the value "false" and a checkbox with the value "true".
I have 2 properties in my ViewModel
class ViewModel1
{
Dictonary<int, string> PossibleValues {get;set;}//key/value
int SelectedKey {get;set}
}
I want to edit this using a Html.DropDownListFor
I want to get MVC to auto serialize the data into/from the ViewModel so I can the following
public ActionResult Edit(ViewModel1 model) ...
What's the best way to accomplish this?
As womp said, a browser will only submit the selected value of a drop down list. This is easily bound by the default model binder, see below.
If you are not editing the PossibleValues list on the client then there is no need to submit them back. If you need to repopulate the list then do it server side in your post action by using the same method you originally populated the Dictionary with.
For example in you page:
<%# Page Language="C#" Inherits="System.Web.Mvc.ViewPage<ViewModel1>" %>
<!-- some html here -->
<%= Html.DropDownListFor(x => x.SelectedKey, new SelectList(Model.PossibleValues, "key", "value"))%>
In your controller
[AcceptVerbs(HttpVerbs.Get)]
public ViewResult Edit() {
var model = new ViewModel1 {
PossibleValues = GetDictionary() //populate your Dictionary here
};
return View(model);
}
[AcceptVerbs(HttpVerbs.Post)]
public ViewResult Edit(ViewModel1 model) { //default model binding
model.PossibleValues = GetDictionary(); //repopulate your Dictionary here
return View(model);
}
Where GetDictionary() is a method that returns your populated Dictionary object.
See this similar question for more details
I don't think you'll be able to construct a dictionary from a dropdownlist on a form. A dropdownlist will only post one value back, which you could set as your SelectedKey property, but you won't be able to reconstruct the PossibleValues dictionary from it.
In order to reconstruct a dictionary, you're going to need to have a form field for every entry in it. You could do something like this, generated with a foreach loop over your dictionary:
<input type="hidden" name="PossibleValues[0].Key" value="key0">
<input type="hidden" name="PossibleValues[0].Value" value="value0">
<input type="hidden" name="PossibleValues[1].Key" value="key1">
<input type="hidden" name="PossibleValues[1].Value" value="value1">
.
.
.
Ultimately I would question the need to repopulate the dictionary from the form. If they can only choose one value, why wouldn't the PossibleValues just be a lookup from somewhere outside your ViewModel (like in your repository?) Why store it with the ViewModel?
The solution is custom ModelBinding in ASP.NET MVC framework here are some examples..
stevesmithblog.com/blog/binding-in-asp-net-mvc
www.singingeels.com/Articles/Model_Binders_in_ASPNET_MVC.aspx
odetocode.com/Blogs/scott/archive/2009/04/27/12788.aspx
odetocode.com/Blogs/scott/archive/2009/05/05/12801.aspx
hope you find them useful...
Thanks