My model has a list of 3 elements, each element has a string (AnswerBody) and a bool (correct).
When I submit the form, I get the values perfectly.
The problem is that, when selecting more than one radio button they all stay selected.
It shouldn't be like this. It should deselect the previous choice when selecting another one.
I'm one week stuck with this trick and I don't know how to solve.
Any help I'll be appreciated.
This is a part of my View:
<table>
<tr>
<td>
#Html.TextAreaFor(c => c.AnsLst[0].AnswerBody)
</td>
<td>
#Html.RadioButtonFor(c => c.AnsLst[0].Correct, true)
</td>
</tr>
<tr>
<td>
#Html.TextAreaFor(c => c.AnsLst[1].AnswerBody)
</td>
<td>
#Html.RadioButtonFor(c => c.AnsLst[1].Correct, true)
</td>
</tr>
<tr>
<td>
#Html.TextAreaFor(c => c.AnsLst[2].AnswerBody)
</td>
<td>
#Html.RadioButtonFor(c => c.AnsLst[2].Correct, true)
</td>
</tr>
</table>
If you are using a radio button group in which only one value can be selected at a time you should bind them to a single property on your view model which will hold the selected value and not to a collection:
<table>
<tr>
<td>
#Html.TextAreaFor(c => c.AnsLst[0].AnswerBody)
</td>
<td>
#Html.RadioButtonFor(c => c.Answer, "value 1")
</td>
</tr>
<tr>
<td>
#Html.TextAreaFor(c => c.AnsLst[1].AnswerBody)
</td>
<td>
#Html.RadioButtonFor(c => c.Answer, "value 2")
</td>
</tr>
<tr>
<td>
#Html.TextAreaFor(c => c.AnsLst[2].AnswerBody)
</td>
<td>
#Html.RadioButtonFor(c => c.Answer, "value 3")
</td>
</tr>
</table>
Now since the 3 radio buttons are bound to the same property on your view model (Answer) when the form is submitted this property will get the value of the selected answer. The value that will be sent is the one passed as second argument to the RadioButton helper.
So basically you will have the following property on your view model to store the answer:
public string Answer { get; set; }
In y example I have set some arbitrary values for the answers but you could use for example the id of the answer so that you could identify it:
#Html.RadioButtonFor(c => c.Answer, c.AnsLst[0].AnswerId)
#Html.RadioButtonFor(c => c.Answer, c.AnsLst[1].AnswerId)
#Html.RadioButtonFor(c => c.Answer, c.AnsLst[2].AnswerId)
Related
In my MVC view, I am displaying list of data from my model in a table as shown below. How to make a specified row to change color when one of the field satisfy certain condition within my if-else statement? It does not seems like I can add a jquery inside my if-else there for the purpose...
My View:
...
<table>
...
#foreach (var item in Model) {
<tr>
<td>
#Html.DisplayFor(modelItem => item.field1)
</td>
<td>
#Html.DisplayFor(modelItem => item.field2)
</td>
<td>
#if(item.field3== 0){
//change this row to grey color
}
else {
#Html.DisplayFor(modelItem => item.field3)
}
</td>
....
</table>
You just need to do it up where you are outputting the row. One way would be:
<table>
...
#foreach (var item in Model) {
<tr style='background-color: #(item.field3 == 0 ? "gray" : "white");'>
<td>
#Html.DisplayFor(modelItem => item.field1)
</td>
<td>
#Html.DisplayFor(modelItem => item.field2)
</td>
<td>
#Html.DisplayFor(modelItem => item.field3)
</td>
}
....
</table>
There are all sorts of ways to construct that conditional, just depends on your scenario. But the key is that you can access the field3 property of the item object anywhere in that foreach loop, just like a normal C# foreach
I have a scenario where i have 3 radio buttons two of them have default values and for the third one I want that it should be assigned the value of a textbox. How can I achieve this below is some of my code :
<tr>
<td>
<label style="padding-bottom:0.5em;font-size:1em">
#Html.RadioButtonFor(model => model.LicenseValidityDuration, "0", new { style = "width:2em" })
Never
</label>
</td>
<td></td>
</tr>
<tr>
<td>
<label style="padding-bottom:0.5em;font-size:1em">
#Html.RadioButtonFor(model => model.LicenseValidityDuration, "-1", new { style = "width:2em" })
Always
</label>
</td>
<td></td>
</tr>
<tr>
<td>
<label style="padding-bottom:0.5em;font-size:1em">
#Html.RadioButtonFor(model => model.LicenseValidityDuration, model => model.LicenseValidityDuration, new { style = "width:2em" })
Days Before Expiry
</label>
</td>
<td>
#Html.EditorFor(model => model.LicenseValidityDuration)
</td>
</tr>
I'm trying to do something like the following:
<tbody class="searchable">
#foreach (var item in Model)
{
if (item.Account.AccountName != "xyz")
<tr class="danger">
else
<tr>
<td>
#Html.DisplayFor(modelItem => item.LocationName)
</td>
<td>
#Html.DisplayFor(modelItem => item.City)
</td>
</tr>
}
</tbody>
The compiler doesn't like the if statement where I'm trying to create a row tag dynamically. The error I'm getting says the #foreach block is missing a close '}'. My guess is that the 'if' statement is being misinterpreted. Can someone suggest how I can fix this?
You can just avoid the if, and do something like:
<tr class='#(item.Account.AccountName != "xyz" ? "danger" : "")'>
<td>
#Html.DisplayFor(modelItem => item.LocationName)
</td>
<td>
#Html.DisplayFor(modelItem => item.City)
</td>
</tr>
I have a form which is submitted via ajax to the Controller. The Controller collects the data from the Model and then creates a new ViewModel and passes it to the partial view which is then updated on the Client.
The problem is that the textboxes are not cleared out as expected. The message arrives in the View as expected, so it doesn't make sense that the TextBoxes are not cleared out.
Yet it seems to be a browser issue as this is the resulting HTML, which note, does not have anything in the value:
<input id="Address_Address1" name="Address.Address1" type="text" value="" />
Yet the user sees the value that was priorly entered.
Here is the controller:
//Process Order Here
//This should clear out the ViewModel.
order = new OrderViewModel();
order.Message = "Report Added to your cart";
return PartialView("_NewOrderPartial", order);
This is the partial View:
#model NTC.PropertySearch.Models.OrderViewModel
#using (Ajax.BeginForm("NewOrder", "Order", new AjaxOptions { InsertionMode = InsertionMode.Replace, UpdateTargetId = "neworder" }))
{
<div id="neworder">
<table>
<tr>
<th style="width: 300px;">
<h3>Enter property address below</h3>
</th>
<th style="width: 30px;"></th>
<th style="width: 300px;">
<h3>Choose your report below</h3>
</th>
</tr>
<tr>
<td>
<div class="form">
<table>
<tr>
<td>
#Html.LabelFor(m => m.Address.Address1)
</td>
<td>
#Html.TextBoxFor(m => m.Address.Address1)
</td>
<td>
#Html.ValidationMessageFor(m => m.Address.Address1)
</td>
</tr>
<tr>
<td>
#Html.LabelFor(m => m.Address.Address2)
</td>
<td>
#Html.TextBoxFor(m => m.Address.Address2)
</td>
<td>
#Html.ValidationMessageFor(m => m.Address.Address2)
</td>
</tr>
<tr>
<td>
#Html.LabelFor(m => m.Address.City)
</td>
<td>
#Html.TextBoxFor(m => m.Address.City)
</td>
<td>
#Html.ValidationMessageFor(m => m.Address.City)
</td>
</tr>
<tr>
<td>
#Html.LabelFor(m => m.Address.State)
</td>
<td>
#Html.TextBoxFor(m => m.Address.State)
</td>
<td>
#Html.ValidationMessageFor(m => m.Address.State)
</td>
</tr>
<tr>
<td>
#Html.LabelFor(m => m.Address.ZipCode)
</td>
<td>
#Html.TextBoxFor(m => m.Address.ZipCode)
</td>
<td>
#Html.ValidationMessageFor(m => m.Address.ZipCode)
</td>
</tr>
</table>
<input type="submit" value="Add Report" />
#Html.DisplayFor(m=> m.Message)
</div>
</td>
</tr>
</table>
</div>
The reason for this is because the Html helpers such as TextBox are first looking at the ModelState when binding their values and only after that in the View model. This often happens when people attempt to modify/clear some value to the view model in an HttpPost controller action. The corresponding view will use the initial POSTed value and not the value in the view model.
You should clear the ModelState as well in your controller action:
ModelState.Clear();
order = new OrderViewModel();
Alternatively if you do not want to clear the entire ModelState (although in your case this seems to be the case as you are reinitializing the entire view model) you could clear only some properties that you intend to modify:
ModelState.Remove("SomeProperty");
viewModel.SomeProperty = "some new value";
When I try to add #Html.HiddenFor(#Model.ID) to my code, I get the following error when access the page:
Compiler Error Message: CS0411: The type arguments for method 'System.Web.Mvc.Html.InputExtensions.HiddenFor(System.Web.Mvc.HtmlHelper, System.Linq.Expressions.Expression>)' cannot be inferred from the usage. Try specifying the type arguments explicitly.
I tried reading MSDN, but the documentation is awful (they don't provide a single code example in the documentation for this method.
Here is my View:
#model CustomerService.Entity.Order
#using CustomerService.Entity
#{
ViewBag.Title = "OrderDetails";
}
<h2>
OrderDetails</h2>
#using (Html.BeginForm("HandleSubmit", "Home", FormMethod.Post))
{
<table border="1">
<tr>
<td>
<b>Order #</b>
</td>
<td>
#Model.ID
</td>
</tr>
<tr>
<td>
<b>Description</b>
</td>
<td>
#Model.Description
</td>
</tr>
<tr>
<td>
<b>Salesperson Name</b>
</td>
<td>
#Model.SalespersonName
</td>
</tr>
</table>
<h3>
Line Items</h3>
<input id="btnAddLineItem" type="submit" name="AddLineItem" value="AddLineItem" />
#Html.HiddenFor(#Model.ID)
<table border="1">
<tr>
<td>
<b>Line Item ID</b>
</td>
<td>
<b>Description</b>
</td>
</tr>
#for (int i = 0; i < #Model.LineItems.Count; ++i)
{
<tr>
<td>
#Model.LineItems[i].ID
</td>
<td>
#Model.LineItems[i].Description
</td>
</tr>
}</table>
}
HiddenFor takes an expression.
#Html.HiddenFor( model => model.ID )
HiddenFor method should get an Expression as a parameter not a value:
#Html.HiddenFor(m => m.ID)
Instead of: #Html.HiddenFor(#Model.ID)
Method signature:
HiddenFor<TModel, TProperty>(HtmlHelper<TModel>,
Expression<Func<TModel, TProperty>>)
In plain text you should give an Expression that gets an "instance" of the type of your model(in this case CustomerService.Entity.Order) and returns the desired property(in this case ID)
MSDN