DOTNET POINT: Ajax Cascading Dropdownlist without using webservice in asp.net

Friday, 24 February 2012

Ajax Cascading Dropdownlist without using webservice in asp.net

Introduction:

Here I will explain how to use Ajax Cascading Dropdownlist without using webservice in asp.net

Description:

In my previous article I explained how to populate dropdown based on other dropdown using asp.net now I will explain how to use Ajax cascading dropdownlist in asp.net.

Here I already explained how to populate dropdown based on another dropdown but now why I am explaining about this Ajax cascading dropdownlist because if we use this Ajax cascading dropdownlist we can get the dropdown data without any postback operation and we don’t need to write extra code to disable dropdowns based on otherdropdown selection all the futures available with this Ajax cascading dropdown directly but here we need to write webservices to populate the dropdowns with data.

Here I will explain with three dropdowns Country dropwdown, State dropdown, Region dropdown I need to populate states dropdown based on country dropdown and I need to populate region dropdown based on states dropdown for that what we have to do first design three tables in sql server with data like this

Country Table

State Table

Region Table

After that add AjaxControlToolkit to your bin folder and design your aspx page like this

<%@ Register Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit" tagPrefix="ajax" %>

</head>

<body>

<asp:ScriptManager ID="scriptmanager1" runat="server"></asp:ScriptManager>

<div>

<table>

<tr>

<td>

Select Country:

</td>

<td>

<asp:DropDownList ID="ddlcountry" runat="server"></asp:DropDownList>

<ajax:CascadingDropDown ID="ccdCountry" runat="server" Category="Country" TargetControlID="ddlcountry" PromptText="Select Country" LoadingText="Loading Countries.." ServiceMethod="x" >

</ajax:CascadingDropDown>

</td>

</tr>

<tr>

<td>

Select State:

</td>

<td>

<asp:DropDownList ID="ddlState" runat="server"></asp:DropDownList>

<ajax:CascadingDropDown ID="ccdState" runat="server" Category="State" ParentControlID="ddlcountry" TargetControlID="ddlState" PromptText="Select State" LoadingText="Loading States.." ServiceMethod="y" >

</ajax:CascadingDropDown>

</td>

</tr>

<tr>

<td>

Select District:

</td>

<td>

<asp:DropDownList ID="ddlRegion" runat="server"></asp:DropDownList>

<ajax:CascadingDropDown ID="ccdRegion" runat="server" Category="District" ParentControlID="ddlState" TargetControlID="ddlRegion" PromptText="Select Region" LoadingText="Loading Regions.." ServiceMethod="z" >

</ajax:CascadingDropDown>

</td>

</tr>

</table>

</div>

</form>

</body>

</html>

C# .net :

using System.Data;

using System.Data.SqlClient;

using System.Collections.Generic;

using System.Collections.Specialized;

using System.Configuration;

using AjaxControlToolkit;

Here we need to remember one point that is we need to write webmethods this format only and use exact parameters that should be same as whatever I mentioned in web method

[System.Web.Services.WebMethod]

public CascadingDropDownNameValue[] BindCountryDetails(string knownCategoryValues,string category)

In this web method we have a chance to change only method name return type also same CascadingDropDownNameValue[]

After completion of writing namespaces and write the following code in webservice page

[System.Web.Script.Services.ScriptMethod()]
    [System.Web.Services.WebMethod]
    public static CascadingDropDownNameValue[] x()
    {
        SqlConnection cn = new SqlConnection(ConfigurationManager.ConnectionStrings["DatabaseConnectionString"].ToString());
        cn.Open();
        SqlDataAdapter da = new SqlDataAdapter("select * from country", cn);
        DataTable dt = new DataTable();
        dt.Clear();
        dt.Reset();
        da.Fill(dt);
        List<CascadingDropDownNameValue> cdv = new List<CascadingDropDownNameValue>();
        string a, b;
        foreach(DataRow dr in dt.Rows)
        {
             a=dr[1].ToString();
            b=dr[0].ToString();
            cdv.Add(new CascadingDropDownNameValue(a, b));
        }
        cn.Close();
        return cdv.ToArray();

    }
    [System.Web.Script.Services.ScriptMethod()]
    [System.Web.Services.WebMethod]
    public static CascadingDropDownNameValue[] y(string knownCategoryValues)
    {
        StringDictionary sd = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
        int j = Convert.ToInt32(sd["COUNTRY"]);
        SqlConnection cn = new SqlConnection(ConfigurationManager.ConnectionStrings["DatabaseConnectionString"].ToString());
        cn.Open();
        SqlDataAdapter da = new SqlDataAdapter("select * from state where cid=" + j + "", cn);
        DataTable dt = new DataTable();
        dt.Clear();
        dt.Reset();
        da.Fill(dt);
        List<CascadingDropDownNameValue> cdv = new List<CascadingDropDownNameValue>();
        string a, b;
        for (int i = 0; i < dt.Rows.Count; i++)
        {
            a = dt.Rows[i][0].ToString();
            b = dt.Rows[i][1].ToString();
            cdv.Add(new CascadingDropDownNameValue(b, a));

        }
        cn.Close();
        return cdv.ToArray();
    }
    [System.Web.Script.Services.ScriptMethod()]
    [System.Web.Services.WebMethod]
    public static CascadingDropDownNameValue[] z(string knownCategoryValues)
    {
        StringDictionary sd = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
        int j = Convert.ToInt32(sd["state"]);
        SqlConnection cn = new SqlConnection(ConfigurationManager.ConnectionStrings["DatabaseConnectionString"].ToString());
        cn.Open();
        SqlDataAdapter da = new SqlDataAdapter("select * from district where sid=" + j, cn);
        DataTable dt = new DataTable();
        dt.Clear();
        dt.Reset();
        da.Fill(dt);
        string a, b;
        List<CascadingDropDownNameValue> cdv = new List<CascadingDropDownNameValue>();
        foreach (DataRow dr in dt.Rows)
        {
            a = dr[0].ToString();
            b = dr[1].ToString();
            cdv.Add(new CascadingDropDownNameValue(b, a));
        }
        cn.Close();
        return cdv.ToArray();
    }

Demo

Download sample code attached

DOTNET POINT

Friday, 24 February 2012

Ajax Cascading Dropdownlist without using webservice in asp.net

No comments:

Post a Comment