I am trying to make cascading dropdown list in ASP.NET
MVC4
, both values for my dropdown list's comes from methods, so am in trouble how to pass value form one dropdown list to another.
Here's how I get values for the first dropdown list:
var CampaignInfo1 = CampaignManagementService.GetAdvertisers((string)Session["ticket"]);
List<CampaignList1> items1 = new List<CampaignList1>();
foreach (var element in CampaignInfo1)
{
items1.Add(new CampaignList1() { ID1 = element.Key, Name1 = element.Value });
}
var listOfCamp1 = new SelectList(items1, "ID1", "Name1", 1);
ViewData["list1"] = listOfCamp1;
And dropdown list in view:
@Html.DropDownList("list1", ViewData["list1"] as SelectList, "-- Select Client -1-")
The second dropdown list value am getting almost same method:
var CampaignInf = CampaignManagementService.GetCampaigns((string)Session["ticket"], IDFromfirstDDL);
List<AlreadyCreatedCampaignList> itemas = new List<AlreadyCreatedCampaignList>();
foreach (var element in CampaignInf)
{
itemas.Add(new AlreadyCreatedCampaignList() { campID = element.Key, campName = element.Value });
}
var listOfCam = new SelectList(itemas, "campID", "campName", 1);
ViewData["clist"] = listOfCam;
But there is a problem that in method GetCampaigns I have to pass the id(IDFromfirstDDL) which I get from first DDL, and only then method return values which are for that id.
The problem is that I don't know how to pass that selected value from first DDL to second, without any form submit, because I need that second DDL changes his values immediately after first DDL changes.
i made it combining http://kruisit.nl/articles/asp.net-mvc-linked-dropdown/ and http://www.appelsiini.net/projects/chained jquery chained selector this article
currently using in my site
public static class LinkedDropdownHelper
{
#region Methods
public static MvcHtmlString LinkedDropdownListFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, string parent, IEnumerable<LinkedSelectListItem> selectList ,bool removedefault=false)
{
ModelMetadata metadata = ModelMetadata.FromLambdaExpression( expression,htmlHelper.ViewData );
var selectedvalue = metadata.Model;
string propertyName = metadata.PropertyName;
TagBuilder select = new TagBuilder("select");
select.Attributes.Add("id", propertyName);
select.Attributes.Add("name", propertyName);
//select.Attributes.Add("class", "linked-dropdown");
select.Attributes.Add("class", parent);
foreach (var item in selectList)
{
if (removedefault && item.Value == "-1")
{
//skip default
}
else
{
TagBuilder option = new TagBuilder("option");
option.InnerHtml = item.Text;
option.Attributes.Add("value", item.Value);
option.Attributes.Add("class", item.LinkValue);
if (item.Selected)
{
option.Attributes.Add("selected", "selected");
}
select.InnerHtml += option.ToString(TagRenderMode.Normal);
}
}
//below code was changed by abdurrauf to support jquery chains
string script = @"<script type='text/javascript'>$(document).bind('ready', function(){
$('#" + propertyName + "').chained('#" + parent + "');"+
@"$('select[name=""" + propertyName + @"""]').val("""+selectedvalue+@""");" +
"});</script>";
return MvcHtmlString.Create(script + select.ToString(TagRenderMode.Normal));
}
#endregion Methods
}
public class LinkedSelectList : IEnumerable<LinkedSelectListItem>
{
#region Constructors
public LinkedSelectList(IEnumerable items, string dataValueField, string dataTextField, string dataLinkedValueField, IEnumerable selectedValues)
{
if (items == null)
{
throw new ArgumentNullException("items");
}
Items = items;
DataValueField = dataValueField;
DataTextField = dataTextField;
DataLinkedValueField = dataLinkedValueField;
SelectedValues = selectedValues;
}
#endregion Constructors
#region Properties
public string DataLinkedValueField
{
get; private set;
}
public string DataTextField
{
get; private set;
}
public string DataValueField
{
get; private set;
}
public IEnumerable Items
{
get; private set;
}
public IEnumerable SelectedValues
{
get; private set;
}
#endregion Properties
#region Methods
public virtual IEnumerator<LinkedSelectListItem> GetEnumerator()
{
return GetListItems().GetEnumerator();
}
IEnumerator IEnumerable.GetEnumerator()
{
return GetEnumerator();
}
internal IList<LinkedSelectListItem> GetListItems()
{
return GetListItemsWithValueField();
}
private static string Eval(object container, string expression)
{
object value = container;
if (!String.IsNullOrEmpty(expression))
{
value = DataBinder.Eval(container, expression);
}
return Convert.ToString(value, CultureInfo.CurrentCulture);
}
private IList<LinkedSelectListItem> GetListItemsWithValueField()
{
HashSet<string> selectedValues = new HashSet<string>(StringComparer.OrdinalIgnoreCase);
if (SelectedValues != null)
{
selectedValues.UnionWith(from object value in SelectedValues select Convert.ToString(value, CultureInfo.CurrentCulture));
}
var listItems = from object item in Items
let value = Eval(item, DataValueField)
select new LinkedSelectListItem
{
Value = value,
Text = Eval(item, DataTextField),
LinkValue = Eval(item, DataLinkedValueField),
Selected = selectedValues.Contains(value)
};
return listItems.ToList();
}
#endregion Methods
}
public class LinkedSelectListItem
{
#region Properties
public string LinkValue
{
get; set;
}
public bool Selected
{
get; set;
}
public string Text
{
get; set;
}
public string Value
{
get; set;
}
#endregion Properties
}