Casecading dropdown using JQuery.
ajax
,
asp.net
,
C#
,
J Query
,
JavaScript
No comments
1) Put the following JavaScript function on the page:
function BindDropDown(dropdown_parent,dropdown_child,selectedVal)
{
if(document.getElementById(dropdown_parent).selectedIndex>0)
{
$.ajax
({
url: "/GetAjaxData.aspx",
data: "type=products&value="+document.getElementById(dropdown_parent).options[document.getElementById(dropdown_parent).selectedIndex].value,
success: function(message1)
{
var selectedindex=0;
var rows1 = message1.split("\n");
var iCount = 0;
document.getElementById(dropdown_child).options.length = 0;
for (iCount = 0; iCount < rows1.length; iCount++)
{
var valu=rows1[iCount].split("|");
if(valu[1].replace(/^\s*/, "").replace(/\s*$/, "")==selectedVal)
selectedindex=iCount;
var oOption = new Option(valu[0],valu[1].replace(/^\s*/, "").replace(/\s*$/, ""));
document.getElementById(dropdown_child).options.add(oOption);
}
document.getElementById(dropdown_child).options[selectedindex].selected=true;
return false;
}
});
}
else
{
document.getElementById(dropdown_child).options.length = 0;
document.getElementById(dropdown_child).options.add(new Option("--Select--", "0"));
}
}
2) Call The Following function on dropdown's selected index change:
BindProducts('<%=ddlParent.ClientID%>', '<%=ddlChild.ClientID%>', '<%=Id%>')
3) Put the following code on the GetAjaxData.aspx page:
2) Call The Following function on dropdown's selected index change:
BindProducts('<%=ddlParent.ClientID%>', '<%=ddlChild.ClientID%>', '<%=Id%>')
3) Put the following code on the GetAjaxData.aspx page:
protected void Page_Load(object sender, EventArgs e)
{
ReturnDDLData(Convert.ToInt32(Request.QueryString["value"]));
}
private void ReturnDDLData(Int32 selectedId)
{
Response.Clear();
StringBuilder sbResponse = new StringBuilder();
Collection m_oCollection = new Collection();
m_oCollection.GetCollection(selectedId);
sbResponse.Append(string.Concat("--Select--", "|0", Environment.NewLine));
foreach (Product m_oItem in m_oCollection)
{
sbResponse.Append(string.Concat(m_oItem.Name, "|", m_oItem.ID.Value.ToString().Trim()) + Environment.NewLine);
}
Response.Output.Write(sbResponse.ToString().Substring(0, sbResponse.ToString().LastIndexOf(Environment.NewLine)));
Response.End();
}
Subscribe to:
Post Comments
(
Atom
)
No comments :
Post a Comment