I populated a dropdownlist using the List<> in the controller class. I currently have hard-coded values in the List<>. I am not using any databse. It works fine. Now I need to populate a table with some values based on the item selected from the dropdownlist.
My dropdownlist data looks like this in the controller
List<string> x =
new
List<string>();
x.Add("list1");
x.Add("list2");
x.Add("list3");
ViewData["y"] =
new
SelectList(x);
how can I populate some data below this dropdownlist in the view based on the selected dropdownlist item.
any help is greatly appriciated. tried a lot but couldn't find any answer.
This is what I would do. I would use jquery to set up a change handler on the dropdown list and afterwards fireoff an ajax request to fetch the new data and display it under the dropdown list in a div.
This approach works, but also depends on javascript.
Here's a simple examle . The controller
[AcceptVerbs(HttpVerbs.Get)]
public ActionResult DropDownTest() {
List<string> x = new List<string>();
x.Add("list1");
x.Add("list2");
x.Add("list3");
ViewData["y"] = new SelectList(x);
return View();
}
[AcceptVerbs(HttpVerbs.Get)]
public ActionResult FetchData(string dropdownValue)
// This action method gets called via an ajax request
{
return Json(string.Format("Server Data: {0} You selected {1}",DateTime.Now,dropdownValue));
}
This is a simple example that just writes out a string, but you can easily pass a json serialized object and list multiple rows or data. Hope this helps.
I think my question was very vague...sorry my mistake.
I have a couple of list collection in my controller class and now when I select a dropdown item I want the list collection to be populated as a table.
in the sample you provided the div shows the dropdown value selected, but I want a list collection to be populated.
For now I am able to pull out only one list collection for all the dropdown selection. Can you please provide me with a sample that shows different list collection on dropdown selected value.
bindasbubu
Member
6 Points
21 Posts
need help with MVC dropdownlist selected item
Nov 25, 2009 06:18 PM|LINK
Hi All,
I populated a dropdownlist using the List<> in the controller class. I currently have hard-coded values in the List<>. I am not using any databse. It works fine. Now I need to populate a table with some values based on the item selected from the dropdownlist.
My dropdownlist data looks like this in the controller
List<string> x = new List<string>();
x.Add("list1");
x.Add("list2");
x.Add("list3");
ViewData["y"] = new SelectList(x);
how can I populate some data below this dropdownlist in the view based on the selected dropdownlist item.
any help is greatly appriciated. tried a lot but couldn't find any answer.
ramesh866
Participant
1467 Points
375 Posts
Re: need help with MVC dropdownlist selected item
Nov 25, 2009 06:36 PM|LINK
why dont you use normal drop down list.. any particular reason???
bindasbubu
Member
6 Points
21 Posts
Re: need help with MVC dropdownlist selected item
Nov 25, 2009 06:39 PM|LINK
am using asp.net MVC design pattern. so i must use htmlhelper dropdownlist and want to pass data from the controller class
CodeHobo
All-Star
18647 Points
2647 Posts
Re: need help with MVC dropdownlist selected item
Nov 25, 2009 07:22 PM|LINK
This is what I would do. I would use jquery to set up a change handler on the dropdown list and afterwards fireoff an ajax request to fetch the new data and display it under the dropdown list in a div.
This approach works, but also depends on javascript.
Here's a simple examle . The controller
[AcceptVerbs(HttpVerbs.Get)] public ActionResult DropDownTest() { List<string> x = new List<string>(); x.Add("list1"); x.Add("list2"); x.Add("list3"); ViewData["y"] = new SelectList(x); return View(); } [AcceptVerbs(HttpVerbs.Get)] public ActionResult FetchData(string dropdownValue) // This action method gets called via an ajax request { return Json(string.Format("Server Data: {0} You selected {1}",DateTime.Now,dropdownValue)); }The view :
<script src="<%=Url.Content("~/Scripts/jquery-1.3.2.js")%>" type="text/javascript"></script> <script type="text/javascript"> $(function() { $("#y").change(function() { var selectedItem = $(this).val(); $.getJSON("<%=Url.Action("FetchData") %>/?dropdownValue=" + selectedItem, function(data) { $("#Data").html(data); }); }); }); </script> Test:<%=Html.DropDownList("y", ViewData["y"] as SelectList)%> <div id="Data"></div>This is a simple example that just writes out a string, but you can easily pass a json serialized object and list multiple rows or data. Hope this helps.
Blog | Twitter : @Hattan
bindasbubu
Member
6 Points
21 Posts
Re: need help with MVC dropdownlist selected item
Nov 25, 2009 07:40 PM|LINK
thanks for your quick reply....
but I get this eror when I run it - 'Too many characters in character literal' and points me to
$.getJSON("<%=Url.Action('FetchData') %>/?dropdownValue=" + selectedItem
CodeHobo
All-Star
18647 Points
2647 Posts
Re: need help with MVC dropdownlist selected item
Nov 25, 2009 07:52 PM|LINK
Change this
<%=Url.Action('FetchData') %>
To
this
<%=Url.Action("FetchData") %>
Fetch data has to be in Double quotes and not single quotes since it's a server side string literal.
Blog | Twitter : @Hattan
bindasbubu
Member
6 Points
21 Posts
Re: need help with MVC dropdownlist selected item
Dec 01, 2009 07:36 PM|LINK
I think my question was very vague...sorry my mistake.
I have a couple of list collection in my controller class and now when I select a dropdown item I want the list collection to be populated as a table.
in the sample you provided the div shows the dropdown value selected, but I want a list collection to be populated.
For now I am able to pull out only one list collection for all the dropdown selection. Can you please provide me with a sample that shows different list collection on dropdown selected value.
Currently this is how my code looks
Controller:
public
ActionResult DropDown()
{
//List for populating DropDownList
List<string> x = new List<string>();
x.Add("list1");
x.Add("list2");
x.Add("list3");
ViewData["y"] = new SelectList(x);
//List for populating DataGrid
List<string> lst1 = new List<string>();
lst1.Add("abc");
lst1.Add("abcd");
lst1.Add("xyz");
ViewData["a"] = new List(lst1);
return View("link");
}
View:
<
script type="text/javascript">
$(
function(){
$(
"#Show").click(function(){
var selected = $("#y option:selected");
if(selected.val() != 0){$(
'#Table').css('visibility', 'visible');
}
});
});
</script><
div>
<%
= Html.DropDownList("y", null, "---Select---", new { @style = "width: 200px;" })%>
<input type="button" value="Show" id="Show" />
<table id="Table" style="visibility:hidden">
<tbody>
<%
foreach (var links in ViewData["a"] as List<string>) {
} %>
</tbody>
</table>
</div>
Narsa
Member
105 Points
254 Posts
Re: need help with MVC dropdownlist selected item
Jan 05, 2010 08:14 AM|LINK
Hi,
great example.... i dont abt jquery, can u help me on this??
i have partial views like this...
<%Html.RenderPartial("~/Views/Account/RegisterPartialViews/CompaniesandAgencies.ascx")%> <%Html.RenderPartial("~/Views/Account/RegisterPartialViews/Publisher.ascx")%> <%Html.RenderPartial("~/Views/Account/RegisterPartialViews/Individual.ascx")%>asp.net mvc2
Narsa Reddy