How DropDownList's SelectedIndexChanged() works without PostBack?

Question

DropDownList's SelectedIndexChanged() Event fills the ListBox on the page. Obviously this posts the page back to the server. Is there any way to make it happen without full postback?

protected void ddlTablo_SelectedIndexChanged(object sender, EventArgs e)
{
    List<string> list = new List<string>();
    ListBox1.Items.Clear();
    var columnNames= from t in typeof(Person).GetProperties() select t.Name;
    foreach (var item in columnNames)
    {
         list.Add(item);
    }
    ListBox1.DataSource = list;
    ListBox.DataBind();
}

slfan · Accepted Answer · 2020-01-17T16:58:46.840

9

You could put the DropDownList into an <asp:UpdatePanel> and set the trigger to the SelectedIndexChanged event of the DropDownList.

Something like this (don't forget the script manager)

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

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
   <ContentTemplate>
      <asp:DropDownList ID="drop1" runat="server" OnSelectedIndexChanged="ddlTablo_SelectedIndexChanged" />
   </ContentTemplate>
   <Triggers>
      <asp:AsyncPostbackTrigger ControlID="drop1" EventName="SelectedIndexChanged" />
   </Triggers>
</asp:UpdatePanel>

edited Jan 17 '20 at 16:58

answered Feb 25 '14 at 18:13

slfan

8,950
115
65
78

1

Hi, can you please explain what difference the "AsyncPostbackTrigger" does? To me it looks like I get the same effect without it? Since I'm setting the first dropdown to AutoPostBack="true". (Im updating a second DDL after what is chosen in the first) – Green_qaue Feb 14 '15 at 18:30
You can see an answer to your question here: http://stackoverflow.com/questions/15330089/difference-between-asyncpostbacktrigger-and-postbacktrigger-on-updatepanel. Basically a sync postback will post and load the whole form whereas an asyncpostback only reloads part of the page. – slfan Feb 14 '15 at 22:45
@slfan You say to set `AutoPostBack="true"` on the DropDownList but don't do it in the example. Which is right? – Max Voisard Jan 17 '20 at 06:29
@MaxVoisard. You are right, the AutoPostBack is not required, because we have the AsyncPostbackTrigger. I updated my answer – slfan Jan 17 '20 at 16:57

score 3 · Answer 2 · answered Feb 25 '14 at 18:07

3

You can send ajax call, using asp.net UpdatePanel or use jQuery ajax. This wont do postback and your whole page wont get refreshed.

The UpdatePanel is quite straight forward and easy to use. ASP.net ajax will generate the asyn calls for you whereas jQuery ajax will probably need you to render html using javascript.

answered Feb 25 '14 at 18:07

Adil

146,340
25
209
204

1

Any kind of ajax (async call) could be used. – Adil Feb 25 '14 at 18:11

score 2 · Answer 3 · edited Oct 08 '14 at 07:43

2

In the code snippet below, add this parameter: AppendDataBoundItems="True"

<asp:DropDownList ID="ddlGroupNameFilter" 
    runat="server" 
    AutoPostBack="true" 
    AppendDataBoundItems="true" 
    OnSelectedIndexChanged="ddlLeadgroupName_SelectedIndexChange">
</asp:DropDownList>

edited Oct 08 '14 at 07:43

Michele La Ferla

6,775
11
53
79

answered Oct 08 '14 at 07:13

Vinoth Dexterity

21
1

How DropDownList's SelectedIndexChanged() works without PostBack?

3 Answers3

Linked