Here i have created sample that full fill your requirement.
HTML
<center>
<table>
<tr>
<td>
Countries:
</td>
<td>
<asp:DropDownList ID="ddlCustomers" runat="server">
</asp:DropDownList>
</td>
</tr>
<tr>
<td>
States:
</td>
<td>
<asp:DropDownList ID="ddlStates" runat="server">
</asp:DropDownList>
</td>
</tr>
<tr>
<td>
Cities:
</td>
<td>
<asp:DropDownList ID="ddlCities" runat="server">
</asp:DropDownList>
</td>
</tr>
</table>
<br />
<asp:Button ID="Button1" Text="Save" runat="server" OnClick="Save" />
</center>
<div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
// if not postback then binds dropdownlist
if (!isPostBack) {
var ddlCountries = $("[id*=ddlCustomers]");
var ddlStates = $("[id*=ddlStates]");
var ddlCities = $("[id*=ddlCities]");
//Populate Country DropDown
AjaxCall('GetCountries', ddlCountries);
//Populate State DropDown
AjaxCall('GetStates', ddlStates);
//Populate City DropDown
AjaxCall('GetCities', ddlCities);
}
});
function OnSuccess(response, ddl) {
ddl.empty().append('<option selected="selected" value="0">Please select</option>');
$.each(response.d, function () {
ddl.append($("<option></option>").val(this['Value']).html(this['Text']));
});
}
function AjaxCall(method, ddl) {
$.ajax({
type: "POST",
url: "CS.aspx/" + method,
data: '{}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (r) {
OnSuccess(r, ddl);
}
});
}
</script>
</div>
Code
protected void Page_Load(object sender, EventArgs e)
{
string script;
if (IsPostBack)
{
script = "var isPostBack = true;";
}
else
{
script = "var isPostBack = false;";
}
Page.ClientScript.RegisterStartupScript(GetType(), "IsPostBack", script, true);
}
static string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
[WebMethod]
public static List<ListItem> GetCountries()
{
List<ListItem> countries = ListItems("SELECT CountryId,CountryName FROM Countries");
return countries;
}
[WebMethod]
public static List<ListItem> GetStates()
{
List<ListItem> states = ListItems("SELECT StateId,StateName FROM States");
return states;
}
[WebMethod]
public static List<ListItem> GetCities()
{
List<ListItem> cities = ListItems("SELECT CityId,CityName FROM Cities");
return cities;
}
public static List<ListItem> ListItems(string query)
{
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand(query))
{
List<ListItem> items = new List<ListItem>();
cmd.CommandType = CommandType.Text;
cmd.Connection = con;
con.Open();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
while (sdr.Read())
{
items.Add(new ListItem
{
Value = sdr[0].ToString(), //Value Field(ID)
Text = sdr[1].ToString() //Text Field(Name)
});
}
}
con.Close();
return items;
}
}
}
protected void Save(object sender, EventArgs e)
{
}
Screenshot