I have a model,
public class Customer
{
public string Name { get; set;}
public string CountryCode { get; set;}
}
In the controller
var model = new List<Customer>
{
new Customer { Name = "foo", CountryCode = "US"},
new Customer { Name = "bar", CountryCode = "UK",
};
return PartialView("_Edit", model);
An extension method for displaying all countries:-
public class CountryList
{
public static IEnumerable<SelectListItem> CountrySelectList
{
get
{
var list = new List<SelectListItem>()
{
new SelectListItem { Value = "US", Text="US" },
new SelectListItem { Value = "UK", Text="UK" },
};
return list;
}
}
}
In the PartialView
#model List<Customer>
#Html.DropDownListFor(model => model[i].CountryCode, CountryList.CountrySelectList, "Select Country Type")
But the drop down doesn't select each customer's country code? Any thoughts?
PS: It is using model[i] => which is of type Customer, for simplicity i had removed the forloop before rendering the html tags.
#using(Html.BeginForm())
{
for(int i = 0; i < Model.Count(); i++)
{
#Html.TextBoxFor(model => model[i].Name)
#Html.DropDownListFor..........
}
}
Because your CoutryList helper does returns a list of SelectListItems that all have Selected property set to False (which is default).
I would rewrite your helper method as follows:
public static IEnumerable<SelectListItem> CountrySelectList(string selectedCountryCode)
{
get
{
var list = new List<SelectListItem>()
{
new SelectListItem { Value = "US", Text="US" },
new SelectListItem { Value = "UK", Text="UK" },
};
var selectedListItem = list.FirstOrDefault(t=>t.Value== selectedCountryCode);
if(selectedListItem!=null)
selectedListItem.Selected=true;
return list;
}
}
In view:
#Html.DropDownListFor(model => model[i].Customer, CountryList.CountrySelectList(model[i].Customer.CountryCode), "Select Country Type")
I have a MVC3 page that has to dropdownList contains Sex(male,female) and Role(admin,Operator), in RegisterViewModel I have done like this :
public List<SelectListItem> SelectedItemForSex { get; set; }
public List<SelectListItem> SelectedItemForRole { get; set; }
public string SearchText { get; set; }
public string SelectedValue { get; set; }
//public string SelectedValueForRole { get; set; }
public static RegisterViewModel Get()
{
var model = new RegisterViewModel { SelectedItemForSex = new List<SelectListItem>() };
model.SelectedItemForSex.Add(new SelectListItem() { Text = "Male", Value = "1" });
model.SelectedItemForSex.Add(new SelectListItem() { Text = "Femle", Value = "2" });
model.SelectedItemForRole.Add(new SelectListItem() {Text = "Administrator", Value = "1"});
model.SelectedItemForRole.Add(new SelectListItem() {Text = "Operator", Value = "2"});
return model;
}
and in get action of Register I have this code :
public ActionResult Create()
{
var model = RegisterViewModel.Get();
return View(model);
}
and also in razor :
<div>
#Html.LabelFor(register => register.Sex)
#Html.DropDownListFor(register => register.SelectedValue, new SelectList(Model.SelectedItemForSex, "Value", "Text"))
</div>
<div>
#Html.LabelFor(register => register.Role)
#Html.DropDownListFor(register => register.SelectedValue, new SelectList(Model.SelectedItemForRole, "Value", "Text"))
</div>
<div>
I know I have Not initialize selectedListItem for Administrator and operator , I wanna to send all of this 4 value via Get() method, How can I do this ??
I'm new towards MVC3 Razor. Currently, I'm facing this error "Object reference not set to an instance of an object.", which I have no idea what is this about.
In Model
public List<SelectListItem> CatList { get; set; }
[Display(Name = "Category")]
public string CatID { get; set; }
In Controller
public ActionResult DisplayCategory()
{
var model = new CatModel();
model.CatList = GetCat();
return View(model);
}
private List<SelectListItem> GetCat()
{
List<SelectListItem> itemList = new List<SelectListItem>();
itemList.Add(new SelectListItem { Text = "1", Value = "1" });
itemList.Add(new SelectListItem { Text = "2", Value = "2" });
return itemList;
}
In CSHTML
#using (Html.BeginForm())
{
<table>
<tr>
<td>#Html.LabelFor(c => c.CatID)</td>
<td>#Html.DropDownListFor(c => c.CatID, Model.CatList)</td>
</tr>
</table>
}
Thanks for any help.
I suspect that you have a POST action in which you forgot to reassign the CatList property of your view model so you are getting the NRE when you submit the form, not when the form is initially rendered:
public ActionResult DisplayCategory()
{
var model = new CatModel();
model.CatList = GetCat();
return View(model);
}
[HttpPost]
public ActionResult Index(CatModel model)
{
// some processing ...
// since we return the same view we need to populate the CatList property
// the same way we did in the GET action
model.CatList = GetCat();
return View(model);
}
private List<SelectListItem> GetCat()
{
List<SelectListItem> itemList = new List<SelectListItem>();
itemList.Add(new SelectListItem { Text = "1", Value = "1" });
itemList.Add(new SelectListItem { Text = "2", Value = "2" });
return itemList;
}
I have no idea what am i doing wrong.
Well i have this form, it's part of complex view.
#{
var filtersAjaxOptions = new AjaxOptions
{
HttpMethod = "POST",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "clientList-body",
OnBegin = "clientList.filterRequestStart()",
OnComplete = "clientList.filterRequestComplete()",
OnSuccess = "clientList.filterRequestSuccess()"
};
}
<span class="clientFilters-filterValue inlineBlock">
#using (Ajax.BeginForm(
"Index",
"ClientList",
new {
ProductId = Model.ClientListViewModel.Filters.ProductId,
ClientFilter = Model.ClientListViewModel.Filters.ClientFilter,
BillFilter = Model.ClientListViewModel.Filters.BillFilter,
DateSortType = Model.ClientListViewModel.Filters.DateSortType,
SortDirection = Model.ClientListViewModel.Filters.SortDirection
},
filtersAjaxOptions,
new
{
id = "clientListDateFilter-form"
}
))
{
#Html.TextBoxFor(
m => m.ClientListViewModel.Filters.BeginDateRange,
new
{
#class = "dp-input textInput inlineBlock",
id = "dp-billDateFilterStart",
}
)
#Html.TextBoxFor(
m => m.ClientListViewModel.Filters.EndDateRange,
new
{
#class = "dp-input textInput inlineBlock",
id = "dp-billDateFilterEnd",
}
)
}
</span>
Here's the filters model
public class FilterModel
{
public FilterModel()
{
ClientFilter = ClientsEnum.All;
BillFilter = ClientBillsEnum.All;
}
public string ProductId { get; set; }
public ClientsEnum ClientFilter { get; set; }
public ClientBillsEnum BillFilter { get; set; }
public DateTime? BeginDateRange { get; set; }
public DateTime? EndDateRange { get; set; }
public DateSortType? DateSortType { get; set; }
public SortDirection? SortDirection { get; set; }
}
This part is ClientListController method Index:
public ActionResult Index(FilterModel filters)
{
var clientListViewModel = GetClientListViewModel(filters, 1, 1, PageSize);
if (ControllerContext.HttpContext.Request.IsAjaxRequest())
return PartialView("Partial/ClientListBody", clientListViewModel);
return View(clientListViewModel);
}
Whenever i submit the form above, it turns to me that fields "BeginDateRange" and "EndDateRange" are null and other fields are set properly. Although, when i insert Request.Form in Watch, i can see the whole data.
UPDATE 1
So i set the <globalisation> in Web.config as this:
<globalisation responseHeaderEncoding="utf-8" culture="en-US">
and yet it doesn't work. Very same result as before.
UPDATE 2
Also when i tried to put all the routevalues data into #Html.HiddenFor, controller saw only nulls. And again, Request.Form is filled prprly.
So the question is: how can i bind form data to incoming model?
TY
The default model binder uses the current culture datetime format when binding datetimes. This means that you have to enter the date into the proper format in your textboxes. On the other hand if you need a fixed format you could use a fixed culture in your web.config (<globalization> element) or write a custom model binder: https://stackoverflow.com/a/7836093/29407
UPDATE:
You need to specify the correct binding prefix because your input fields are named like ClientListViewModel.Filters.BeginDateRange but your controller action takes a FilterModel as parameter instead of the root view model:
public ActionResult Index([Bind(Prefix = "ClientListViewModel.Filters")] FilterModel filters)
{
...
}
But now this will break the other values, so you need to adjust your view as well:
#using (Ajax.BeginForm(
"Index",
"ClientList",
null,
filtersAjaxOptions,
new
{
id = "clientListDateFilter-form"
}
))
{
#Html.HiddenFor(x => x.ClientListViewModel.Filters.ProductId)
#Html.HiddenFor(x => x.ClientListViewModel.Filters.ClientFilter)
#Html.HiddenFor(x => x.ClientListViewModel.Filters.BillFilter)
#Html.HiddenFor(x => x.ClientListViewModel.Filters.DateSortType)
#Html.HiddenFor(x => x.ClientListViewModel.Filters.SortDirection)
#Html.TextBoxFor(
m => m.ClientListViewModel.Filters.BeginDateRange,
new
{
#class = "dp-input textInput inlineBlock",
id = "dp-billDateFilterStart",
}
)
#Html.TextBoxFor(
m => m.ClientListViewModel.Filters.EndDateRange,
new
{
#class = "dp-input textInput inlineBlock",
id = "dp-billDateFilterEnd",
}
)
}
or if you want to send them as part of the form url instead if using hidden fields:
#using (Ajax.BeginForm(
"Index",
"ClientList",
new RouteValueDictionary
{
{ "ClientListViewModel.Filters.ProductId", Model.ClientListViewModel.Filters.ProductId },
{ "ClientListViewModel.Filters.ClientFilter", Model.ClientListViewModel.Filters.ClientFilter },
{ "ClientListViewModel.Filters.BillFilter", Model.ClientListViewModel.Filters.BillFilter },
{ "ClientListViewModel.Filters.DateSortType", Model.ClientListViewModel.Filters.DateSortType },
{ "ClientListViewModel.Filters.SortDirection", Model.ClientListViewModel.Filters.SortDirection },
},
filtersAjaxOptions,
new RouteValueDictionary
{
{ "id", "clientListDateFilter-form" }
}
))
{
#Html.TextBoxFor(
m => m.ClientListViewModel.Filters.BeginDateRange,
new
{
#class = "dp-input textInput inlineBlock",
id = "dp-billDateFilterStart",
}
)
#Html.TextBoxFor(
m => m.ClientListViewModel.Filters.EndDateRange,
new
{
#class = "dp-input textInput inlineBlock",
id = "dp-billDateFilterEnd",
}
)
}
Try this:
public ActionResult Index(FilterModel filters, FormCollection collection)
{
UpdateModel(filters, "ClientListViewModel");
var clientListViewModel = GetClientListViewModel(filters, 1, 1, PageSize);
if (ControllerContext.HttpContext.Request.IsAjaxRequest())
return PartialView("Partial/ClientListBody", clientListViewModel);
return View(clientListViewModel);
}
And in view:
#Html.TextBoxFor(
m => m.ClientListViewModel.FilterModel.EndDateRange,
new
{
#class = "dp-input textInput inlineBlock",
id = "dp-billDateFilterEnd",
}
)
You have strange naming. Also it would be better to use hidden fields then passing values through routevalues.
I have the following error when I click save:
the ViewData item that has the key 'SelectedCategoryId' is of type 'System.Int32' but must be of type 'IEnumerable'?
my controller:
public ActionResult IndexTwee()
{
var listCategories = new List<SelectListItem>();
listCategories.Add(new SelectListItem() {Text="foo",Value="1" });
listCategories.Add(new SelectListItem() { Text = "bar", Value = "2" });
MyViewModelTwee model = new MyViewModelTwee() { };
model.Categories = listCategories;
model.SelectedCategoryId = 2;
return View(model);
}
[HttpPost]
public ActionResult IndexTwee(MyViewModelTwee Model)
{
return View(Model);
}
my model:
public class MyViewModelTwee
{
public int SelectedCategoryId { get; set; }
public IEnumerable<SelectListItem> Categories { get; set; }
}
my view:
#model mvc3DropDown.Models.MyViewModelTwee
#using (Html.BeginForm())
{
#Html.DropDownListFor(
x => x.SelectedCategoryId,
Model.Categories
)
<button>Save</button>
}
Don't forget to rebind the list in your POST action:
[HttpPost]
public ActionResult Index(MyViewModelTwee Model)
{
var listCategories = new List<SelectListItem>();
listCategories.Add(new SelectListItem() { Text = "foo", Value = "1" });
listCategories.Add(new SelectListItem() { Text = "bar", Value = "2" });
Model.Categories = listCategories;
return View(Model);
}
Remember that only the selected value is sent when you submit the html <form>. The other values are lost so you need to refetch them from wherever you fetched them in the GET action. Of course you will externalize this code into a repository layer so that your code now looks like this:
public ActionResult IndexTwee()
{
var model = new MyViewModelTwee
{
SelectedCategoryId = 2,
Categories = _repository.GetCategories()
};
return View(model);
}
[HttpPost]
public ActionResult IndexTwee(MyViewModelTwee Model)
{
Model.Categories = _repository.GetCategories();
return View(Model);
}