Populating existing dropdownlist using AsyncPostBackTrigger, not populate a new dropdownlist

125 views Asked by At

For my web app, I tried to populate dropdownlist (DDL) based on what client click on the calendar extender ( I have this declared in codebehind vb.net to load it from database) using AsyncPostBackTrigger (because I dont want the page to autopostback). I have the button to fire the date selected and it did worked to populate the DDL except not really the way I wanted it to. Instead of updating it in the existing DDL, it creates a new DDL besides the existing ones. I tried looking for solution but did not managed to find any. Anyone can help me figure out why this happens and how to fix this?

Here's my asp.net & javascript code


<asp:Label ID="label16" runat = "server" Text="Select the date"></asp:Label></td>
                                            <td id="Td29" style="width:290px;" runat="server">
                                            <asp:TextBox ID="tbPostingDt" runat="server" style ="width:174px;"></asp:TextBox>
                                            <asp:Button ID="ClickBtn" runat="server" Text="Click"  style="display:none" OnClick="ClickBtn_Click" />
                                                <asp:ImageButton ID="CalendarBtnPostingDt" runat="server" ImageUrl="~/Images/Calendar_scheduleHS.png" AlternateText="Click to display calendar"/>
                                                <cc1:CalendarExtender ID="calPost" runat="server" PopupButtonID="CalendarBtnPostingDt" 
                                                    TargetControlID="tbPostingDt" OnClientDateSelectionChanged="dateSelectionChanged" Format="dd-MMM-yyyy" Enabled="True"></cc1:CalendarExtender></td>

<asp:UpdatePanel ID="UpdatePanel" runat="server" UpdateMode="Conditional">
                                              <ContentTemplate>
                                                <asp:Label ID="label18" runat = "server" Text="Post Cycle No"></asp:Label></td>
                                            <td id="Td33" style="width:290px;" runat="server">
                                                <asp:DropDownList ID = "ddlPostCycleNo" runat = "server" style ="width:180px;">
                                                    <asp:ListItem>ALL</asp:ListItem>
                                                </asp:DropDownList> </td>
                                                </ContentTemplate>
                                                <Triggers>
                                                <asp:AsyncPostBackTrigger ControlID="ClickBtn" EventName="Click" />
                                                </Triggers>
                                                </asp:UpdatePanel>


    function dateSelectionChanged(sender, args) {
    var PostingDt = document.getElementById('<%= tbPostingDt.ClientID%>').value.trim();
    var clickButton = document.getElementById("<%= ClickBtn.ClientID %>");
    clickButton.click();
} 
1

There are 1 answers

0
nf91 On

nevermind I figured it out already. I used the ontextChanged for the textbox when user select the date from calendar, and removed OnClientDateSelectionChanged, triggers and dummy button. I keep the UpdatePanel and it works just the way I wanted.