Checkbox carries the value but not the title - asp.net-mvc

I have a many to many relationship which I have implemented and works perfectly, now I want to have a set of checkboxes on the "insert" page of one of the entities that can insert data in the intermediary table.
I have a ViewModel, which contains an array of the following class:
class CategoryManager {
public int id { get; set; }
public string Title { get; set; }
public bool Checked { get; set; }
}
On the View, I have the following Line to create the checkboxes for each of the array members:
for (int i = 0; i < Model.categories.Count(); i++)
{
#Html.CheckBoxFor(m => m.categories[i].Checked)<i>&nbsp</i>
#Model.categories[i].Title <br/>
}
Now the thing I have noticed is when the page is submitted and the whole ViewModel is sent back to the controller, in the array of "CategoryManager"s, each instance has the ID and the "Checked" passe through properly (depending on whether the user marked the checkbox or not), however, the "Title" for all of them is NULL.
I know this should be a very basic thing I'm missing, but I am a newby ;)
Thank you very much in advance!

You don't generate a control for property Title (or for ID so not sure how you are posting that back back). Add a hidden input for the Title property
for (int i = 0; i < Model.categories.Count; i++)
{
#Html.CheckBoxFor(m => m.categories[i].Checked)
#Html.LabelFor(m => m.categories[i].Checked, "Model.categories[i].Title")
#Html.HiddenFor(m => m.categories[i].ID)
#Html.HiddenFor(m => m.categories[i].ID)
}
Note the use of LabelFor() to create a label associated with the checkbox.

Related

MVC Model Binding EF 6 Missing Parent Reference

I have an object with a collection. I am passing the model to the view and upon post the collection is there, however the reference (containing object Id) is not there and the navigation property is null.
Models
public class Order
{
public int OrderId { get; set;}
public List<OrderItem> OrderItems { get; set;}
}
public class OrderItem
{
public int OrderItemId { get; set; }
public int OrderId { get; set; }
public int SomeOtherValue { get; set; }
}
View:
#model Order
<h2>Edit Form</h2>
#using (Html.BeginForm())
{
#Html.HiddenFor(m => m.OrderId)
//Some other form fields for the order...
#for (int i = 0; i < Model.OrderItems.Count; i++)
{
#Html.TextBoxFor(x => Model.OrderItems[i].SomeOtherValue)
}
<input type="submit" value="Submit"/>
}
When I submit the form, the model gets bound correctly and the while debugging I can see the child OrderItems populated with updated information. However, the OrderId on each OrderItem is set to 0.
Controller
public ActionResult Edit(Order myOrder)
{
myOrder.OrderItems.Count(); // These are populated and the edited values are there.
myOrder.OrderItem[0].Order; // this is null (all order items)
myOrder.OrderItem[0].OrderId; // this is set to 0 (all order items)
//...more stuff and return view.
}
What is the best way to get around this problem? Is there some way to ensure that each OrderItem has a reference to the order when posting the form? I'm hoping I can avoid having to manually account for association in the controller when trying to save the object.
You should add hidden inputs for those fields. Check the code bolow:
..
#for (int i = 0; i < Model.OrderItems.Count; i++)
{
#Html.HiddenFor(x => Model.OrderItems[i].OrderId)
#Html.HiddenFor(x => Model.OrderItems[i].Order)
#Html.TextBoxFor(x => Model.OrderItems[i].SomeOtherValue)
}
..

Passing multiple checkbox values & dyamically generating textboxes based on checkboxes checked in MVC 4

Using - ASP.NET MVC 4
UI is like -
Select Product Code Product Name
Checkbox Product 1 Apple
Checkbox Product 2 Banana
Checkbox Product 3 Grapes
Submit Button
On submit button click i need to validate whether checkbox selected or not. If not, shows message - Please select one product.
If selected, then in the controller, pass the selected Product Code & Name & no. of checkboxes checked to another page
How can we achieve this in MVC 4?
Firstly, #Html.CheckboxFor(m => m.Checkbox, "Product 1") is assigning "Product 1" as a html attribute and will render <input length="9" type="checkbox" .../> (the length attribute has been added with a value equal the number of characters in the text). Its also creating invalid html because of duplicate id attributes. And the [Required] attribute is pointless (a bool is either true or false and will always be required). Currently you have no relationship between the checkbox and product.
You should create a view model to represent what you want to display
public class ProductVM
{
public bool IsSelected { get; set; }
public string Code { get; set; }
public string Name { get; set; }
}
Controller
public ActionResult Edit()
{
List<ProductVM> model = new List<ProductVM>()
{
new ProductVM() { Code = "Product 1", Name = "Apple" },
new ProductVM() { Code = "Product 2", Name = "Banana" },
new ProductVM() { Code = "Product 3", Name = "Grapes"}
};
return View(model);
}
[HttpPost]
public ActionResult Edit(List<ProductVM> model)
{
foreach(ProductVM item in model)
{
if (item.IsSelected)
{
string code = item.Code;
string name= item.Name;
}
}
}
View
#model List<ProductVM>
#using(Html.BeginForm())
{
for(int i = 0; i < Model.Count; i++)
{
#Html.HiddenFor(m => m[i].Code)
#Html.HiddenFor(m => m[i].Name)
#Html.CheckBoxFor(m => m[i].IsSelected)
#Html.LabelFor((m => m[i].IsSelected, Model[i].Name)
}
<input type="submit" />
}
If you want client side validation, you are going to have to write your own validation attribute that implements IClientValitable and write the associated jquery validation methods (but that's the subject of a separate question)

Manually created input is breaking model posting back values

I have the following ViewModel:
public class DataSyncViewModel
{
public ConfigurableDataSyncOptions DataSyncOptions { get; set; }
public int Id { get; set; }
public string SystemName { get; set; }
}
I then loop through the DataSyncOptions to list some textboxes in my view:
#if (#Model.DataSyncOptions != null)
{
if (Model.DataSyncOptions.TextConfigurableOptions != null)
{
for (int i = 0; i < Model.DataSyncOptions.TextConfigurableOptions.Count; i++)
{
<div class="span6">
<h4>#Model.DataSyncOptions.TextConfigurableOptions[i].OptionText?</h4>
<p>
#Html.EditorFor(m => Model.DataSyncOptions.TextConfigurableOptions[i].OptionValue)
</p>
#Html.HiddenFor(m => Model.DataSyncOptions.TextConfigurableOptions[i].OptionName)
</div>
}
}
}
#Html.HiddenFor(m => m.Id)
#Html.HiddenFor(m => m.SystemName)
This works and when the form posts back, I can access SystemName and Id from my controller.
However, if I replace
#Html.EditorFor(m => Model.DataSyncOptions.TextConfigurableOptions[i].OptionValue)
with
#if (Model.DataSyncOptions.TextConfigurableOptions[i].OptionType == "")
{
#Html.EditorFor(m => Model.DataSyncOptions.TextConfigurableOptions[i].OptionValue)
}
else
{
//This appears to be causing issues
<input type="#Model.DataSyncOptions.TextConfigurableOptions[i].OptionType" name="Model.DataSyncOptions.TextConfigurableOptions[#i].OptionValue" value="#Model.DataSyncOptions.TextConfigurableOptions[i].OptionValue" />
}
my values stop posting back with the model. I am trying to allow a plugin creator of my app to specify the input type of an option they have added so am creating the input manually.
Any ideas as to why changing the input generation breaks the model binding on postback?
Instead of Model write Model Class Name in name attribute which is DataSyncViewModel to bind:
<input type="#Model.DataSyncOptions.TextConfigurableOptions[i].OptionType"
name="DataSyncOptions.TextConfigurableOptions[#i].OptionValue"
value="#Model.DataSyncOptions.TextConfigurableOptions[i].OptionValue" />
Actually when we write #Model it is in actualy the instance of type to which our View is strongly typed, and in this case Model is simple string not Razor so it will remain as Model and as name is different of input so it will not be binded to Model property in post.

how to find generic list values by index

I have a Generic List that it contains 4 value .
how can I get my generic list values by index ? I want to get all values in generic list
this is my code :
var Checked = (form.GetValues("assignChkBx")).ToList();
string str = "";
for (int i = 0; i < Checked.Count; i++)
{
str = str + Checked[i]. +",";
}
in this code I got all checkboxes values that checked . Now I want to get all values . how can I get values ?
Your question about the generic list is very misleading and I suspect that it has nothing to do with your real problem.
Depending on how you generated the checkboxes inside your view that might be possible or not. If you hardcoded them using directly an <input type="checkbox"> tag values of checkboxes that were not checked will never be sent to the server - that's how HTML checkboxes work. In this case you will not be able to get all values. If on the other hand you used the Html.CheckBoxFor helper to generate them then you will notice that this helper adds a hidden field to each checkbox in order to send all values. This helper operates on boolean values though.
So I would recommend you creating a view model that will contain 2 properties: one holding the values you are interested in and one boolean property indicating whether the user selected this value or not in the view:
public class ItemViewModel
{
public string Value { get; set; }
public bool Checked { get; set; }
}
and then have a view model which has collection of those items:
public class MyViewModel
{
public ItemViewModel[] Items { get; set; }
}
Now inside your view you can render those values like this:
#model MyViewModel
#using (Html.BeginForm())
{
for ( var i = 0; i < Model.Items.Length; i++)
{
<div>
#Html.CheckBoxFor(x => x.Items[i].Checked)
#Html.HiddenFor(x => x.Items[i].Value)
</div>
}
<button type="submit">OK</button>
}
and finally inside the controller action that this form will be submitted to you will be able to get all values:
[HttpPost]
public ActionResult SomeAction(MyViewModel model)
{
foreach (var item in model.Items)
{
// here you could use item.Checked and item.Value
}
...
}

DropDownListFor does not select value if in for loop

In my view
<%= Html.DropDownListFor( x => x.Countries[ i ], Model.CountryList )%>
in my controller
public int[ ] Countries { get; set; }
public List<SelectListItem> CountryList { get; set; }
When the forms gets posted there is no problem, the dropdown is populated and the values the user selects are posted. But when I try to load the form with already assigned values to the Countries[ ] it does not get selected.
Not sure if this is new to mv4 or if it exists in prior version. But the DropDownListFor includes an additional parameter for the SelectList Constructor.
SelectList(IEnumerable, String, String, Object)
For example:
Html.DropDownListFor( x => x.Countries[ i ], New SelectList(Model.CountryList,"ID","Description",Model.Countries[i]))
Where ID is the Country ID in the CountryList object and Description is the Country Name.
I'm getting the same too. When using foreach to loop around a DropDownListFor (i.e. to render multiple select elements on a page).
My work around is to set the selected value in the controller rather than the view: something like this:
In the controller:
public class FruitList
{
public int? selectedFruit{ get; set; }
public List<SelectListItem> fruits
{
get
{
fruitEntities F = new fruitEntities();
List<SelectListItem> list = (from o in F.Options
select new SelectListItem
{
Value = o.fruitID,
Text = o.fruit,
Selected = o.fruitID == selectedFruit
}).ToList();
return list;
}
}
}
public class ViewModel
{
public List<FruitList> collectionOfFruitLists { get; set; }
}
In the view
<table>
<% for (int i=0; i < Model.collectionOfFruitLists.Count; i++ )
{ %>
<tr>
<td><%: Html.DropDownList("fruitSelectList", collectionOfFruitLists[i].fruits, "Please select...") %></td>
</tr>
<%} %>
</table>
The nifty bit is Selected = o.fruitID == selectedFruit in the controller which acts like a SQL CASE statement; this is really well explained by Lance Fisher (thanks Lance, your post really helped me out :)
I know this question is a bit old but I just came across this problem with looping through a list of objects and attempting to bind the values to DropDownListFor(s) in my Edit View.
I overcame the issue with an inline solution by using the logic from some of the previous solutions given by others for this question.
Binding to my Model:
#Html.DropDownListFor(model => model.QuestionActions[i].QuestionActionTypeId,
Model.QuestionActionTypes.Select(x => new SelectListItem() { Value = x.Value, Text = x.Text, Selected = (x.Value == Model.QuestionActions[i].QuestionActionTypeId.ToString()) }).ToList(),
"Select Action Type",
new { })
Model.QuestionActionTypes is a SelectList that is populated in my Controller.
This is a bit of a hack, and JavaScript reliant but it worked very well for me.
You'll need to know the client IDs that will be produced by the fields (usually these can be worked out manually but for safety you may want to use something like a FieldIDFor method.
You just need to set the values based on the model, in jQuery's $(document).ready:
<script type="text/javascript">
$(document).ready(function () {
#for(var i = 0; i < 5; i++)
{
<text>
$("##Html.FieldIDFor(m => m.Countries[i])").val("#Model.Countries[i]");
</text>
}
});
</script>
A select box sends a single value, so the Countries property should not be an array. Also in your post it is not clear where's the i variable you are using in your lambda expression coming from and this x.CountryList used in the helper won't compile as x is not defined.
Model:
public class MyModel
{
public int SelectedCountry { get; set; }
public List<SelectListItem> CountryList { get; set; }
}
View:
<%= Html.DropDownListFor(x => x.SelectedCountry, Model.CountryList) %>
UPDATE:
According to the comment it seems that there are multiple drop downs. I suspect that the problem might come from the i variable used as index in a for loop.
You might try this instead:
Model:
public class MyModel
{
public int[] Countries { get; set; }
public List<SelectListItem> CountryList { get; set; }
}
View:
<% foreach (var country in Model.Countries) { %>
<%= Html.DropDownListFor(x => country, Model.CountryList) %>
<% } %>
Instead of using a IEnumerable in your viewmodel use a List of objects like this one:
public List<PairVM<string,string>> TiposValorCobertura { get; private set; }
And in your view when you assign the selectable elements for the dropdownlist in the loop, do it this way:
#Html.DropDownListFor(m => m.Coberturas[i].TipoLimiteInferior, new SelectList(Model.TiposValorCobertura,"Key","Description", Model.Coberturas[i].TipoLimiteIferior))
Where "Key" and "Description" are PairVM's properties

Resources