Asp.Net Dropdownlist in UpdatePanel Doesn't Postback When Selected Index Changed

Question

in my project i have placed two dropdownlist in an updatepanel. but event of dropdownlist selectedindexchanged not working. it's my design code in aspx file :

<%@ Page Title="" Language="C#" MasterPageFile="~/Page.master"  AutoEventWireup="true" CodeFile="NewJob.aspx.cs" Inherits="NewJob" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    <div class="panel-body">
    <asp:ScriptManager ID="MainScriptManager" runat="server" />
    <asp:UpdatePanel ID="UpdatePanel" runat="server" UpdateMode="Conditional">
      <Triggers>
            <asp:AsyncPostBackTrigger ControlID="drpCategory" EventName="SelectedIndexChanged" />
      </Triggers>
      <ContentTemplate>
        <table>
          <tr class="centered">
            <td class="table-field" colspan="4">
            <br />
            </td>
          </tr>
          <tr>
            <td class="table-title">
              Category :
            </td>
            <td class="table-field">
              <asp:DropDownList ID="drpCategory" CssClass="piran-control" runat="server" Width="300px"  AutoPostBack="True" ViewStateMode="Enabled" EnableViewState="True" OnSelectedIndexChanged="drpCategory_SelectedIndexChanged">
              </asp:DropDownList>
            </td>
            <td style="padding-right:40px;" >
              SubCategory :
            </td>
            <td class="table-field" colspan="4">
              <asp:DropDownList ID="drpSubCategory" CssClass="piran-control" runat="server" Width="300px" ViewStateMode="Enabled" EnableViewState="True">
              </asp:DropDownList>
            </td>  
          </tr>         
          <tr>
            <td>
              <asp:Button ID="btnInsert" runat="server" Text=" Insert " class="submit_btn btn btn-success" OnClick="Button1_Click" ValidationGroup="Validation" />                
            </td>
          </tr> 
        </table>
      </ContentTemplate>
    </asp:UpdatePanel>
    </div>
</asp:Content>

And this is my code behind :

protected void Page_Load(object sender, EventArgs e) {
  if (!Page.IsPostBack) {
    cData.loadCategory(myDs);
    drpCategory.DataValueField = "ID";
    drpCategory.DataTextField = "Name";
    drpCategory.DataSource = myDs.tblCategory;
    drpCategory.DataBind();     
  }
}

protected void drpCategory_SelectedIndexChanged(object sender, EventArgs e) {
  userData.catID = Int32.Parse(drpCategory.SelectedValue);
  cData.loadSubCategory(myDs);
  drpCategory.DataValueField = "ID";
  drpCategory.DataTextField = "Name";
  drpCategory.DataSource = myDs.tblSubCategory;
  drpCategory.DataBind();
}

i want when chande item or index of drpCategory postback in ajax and show sub category in drpSubCategory. what's your solution ???

Answer 1

don't forget to set your AsyncPostbackTrigger within your update panel

<Triggers>
    <asp:AsyncPostBackTrigger ControlID="drpCategory" EventName="SelectedIndexChanged" />
</Triggers>