CODEWITHSUNDEEP
c#asp.netajaxdrop-down-menuupdatepanel
magnattic
magnattic

Reputation: 12998

Trigger UpdatePanel from Dropdownlist in ChildControl

This is my situation:

Page:

<asp:UpdatePanel ID="updatePanel1" runat="server" ChildrenAsTriggers="true">
  <ContentTemplate>
    ...
    <uc:ChildControl ID="ucChild" runat="server" />
    ...
  </ContentTemplate>
</asp:UpdatePanel>

ChildControl:

...
<asp:DropDownList id="dropDown1" runat="server" />
...

I want to update the UpdatePanel (asynchronously) in the Page when the selection of the DropDownList in the ChildControl changes. I tried AutoPostBack="true", but this always leads to a full PostBack of the Page (see this question).

I tried to use

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

but neither "dropDown1" nor "ucChild.dropDown1" worked as values for ControlID.

I also tried to pass a reference of the UpdatePanel to the ChildControl and add a Trigger in the following way:

protected override void OnPreRender(EventArgs e)
{
    if (ParentUpdatePanel != null)
    {
        AsyncPostBackTrigger trigger = new AsyncPostBackTrigger();
        trigger.ControlID = dropDown1.ID;
        trigger.EventName = "SelectedIndexChanged";
        ParentUpdatePanel.Triggers.Add(trigger);
    }
    base.OnPreRender(e);
}

(also tried with dropDown1.ChildID)

But I am still unable to get the UpdatePanel to trigger when the value in the Dropdown changes. The problem seems to be that the UpdatePanel cannot see the Control in the ChildControl and therefore is unable to set the Trigger accordingly.

How can I do it?

Upvotes: 2

Views: 5878

Answers (2)

Zach Green
Zach Green

Reputation: 3460

Setting AutoPostBack=True on the Drop Down List control should not refresh the entire page if it is in an update panel.

I created a simple example:

default.aspx:

<form id="form1" runat="server">
<div>
    <asp:ScriptManager runat="server"></asp:ScriptManager>
    <asp:UpdatePanel ID="up" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional">
        <ContentTemplate>            
            <uc:UserControl ID="ucChild" runat="Server"></uc:UserControl>
            <asp:Label ID="lbl" runat="server"></asp:Label>
        </ContentTemplate>
    </asp:UpdatePanel>
</div>
</form>

default.aspx.cs (code behind):

public partial class _default : System.Web.UI.Page {
    protected void Page_Load(object sender, EventArgs e) {
        lbl.Text = ucChild.value;
    }   
}

UserControl.ascx:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="UserControl.ascx.cs" Inherits="somenamespace.UserControl" %>
<asp:DropDownList runat="server" ID="ddl" AutoPostBack="true">
    <asp:ListItem Text="1" Value="1"></asp:ListItem>
    <asp:ListItem Text="2" Value="2"></asp:ListItem>
</asp:DropDownList>

UserControl.ascx.cs (code behind):

public partial class UserControl : System.Web.UI.UserControl {
    public string value {
        get { return ddl.SelectedValue.ToString(); }
    }
}

When I change the dropdownlist, the label is updated without a full post back.

Upvotes: 0

Aristos
Aristos

Reputation: 66641

Maybe with a trick putting this code on dropdown list.

dropDown1.Attributes["onchange"] =   
Page.ClientScript.GetPostBackEventReference(ParentUpdatePanel, "") + "; return false;";

When you change the drop down list you send an update event to UpdatePanel using direct javascript call.

Upvotes: 2

Related Questions