locked
Two panels; one button RRS feed

  • Question

  • User-640323567 posted

    Hi,

    I am trying to show two different panels on a single button click based on the value selected in the dropdown list.

    Can we link two modalpopups to a sinlge button? If so, what would be the targetcontrolId for both the modal popups. I gave the same button as targetcontrolid for both popups but seems like its not working. Someone please guide me.

    Thanks.

    Monday, October 12, 2015 2:53 PM

Answers

  • User61956409 posted

    Hi ASPbun,

    You could specify two buttons as target control for two ModalPopupExtender and hide these two buttons. Then you could call ModalPopupExtender.Show() method from server side based on the selected value of dropdownlist to open ModalPopup. The following sample is for your reference.

    #Button1 {
        display: none;
    }
    
    #Button2 {
        display: none;
    }
    
    .bcs {
        background-color: gray;
        opacity: 0.5;
    }
    
    <asp:DropDownList ID="DropDownList1" runat="server">
        <asp:ListItem Value="1">Show Panel1</asp:ListItem>
        <asp:ListItem Value="2">Show Panel2</asp:ListItem>
    </asp:DropDownList>
    <asp:Button ID="Button3" runat="server" Text="Show ModalPopup" OnClick="Button3_Click" />
    
    <asp:Button ID="Button1" runat="server" Text="Button" />
    <asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Button1" PopupControlID="Panel1" BackgroundCssClass="bcs"></asp:ModalPopupExtender>
    <asp:Panel ID="Panel1" runat="server">
        I'm Panel1
    </asp:Panel>
    
    <asp:Button ID="Button2" runat="server" Text="Button" />
    <asp:ModalPopupExtender ID="ModalPopupExtender2" runat="server" TargetControlID="Button2" PopupControlID="Panel2" BackgroundCssClass="bcs"></asp:ModalPopupExtender>
    <asp:Panel ID="Panel2" runat="server">
        I'm Panel2
    </asp:Panel>
    
    protected void Button3_Click(object sender, EventArgs e)
    {
        string index = DropDownList1.SelectedValue.ToString();
    
        if (index == "1") {
            ModalPopupExtender1.Show();
        }
        else if (index == "2")
        {
            ModalPopupExtender2.Show();
        }
    }
    

    Best Regards,

    Fei Han




    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, October 12, 2015 9:58 PM

All replies

  • User61956409 posted

    Hi ASPbun,

    You could specify two buttons as target control for two ModalPopupExtender and hide these two buttons. Then you could call ModalPopupExtender.Show() method from server side based on the selected value of dropdownlist to open ModalPopup. The following sample is for your reference.

    #Button1 {
        display: none;
    }
    
    #Button2 {
        display: none;
    }
    
    .bcs {
        background-color: gray;
        opacity: 0.5;
    }
    
    <asp:DropDownList ID="DropDownList1" runat="server">
        <asp:ListItem Value="1">Show Panel1</asp:ListItem>
        <asp:ListItem Value="2">Show Panel2</asp:ListItem>
    </asp:DropDownList>
    <asp:Button ID="Button3" runat="server" Text="Show ModalPopup" OnClick="Button3_Click" />
    
    <asp:Button ID="Button1" runat="server" Text="Button" />
    <asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Button1" PopupControlID="Panel1" BackgroundCssClass="bcs"></asp:ModalPopupExtender>
    <asp:Panel ID="Panel1" runat="server">
        I'm Panel1
    </asp:Panel>
    
    <asp:Button ID="Button2" runat="server" Text="Button" />
    <asp:ModalPopupExtender ID="ModalPopupExtender2" runat="server" TargetControlID="Button2" PopupControlID="Panel2" BackgroundCssClass="bcs"></asp:ModalPopupExtender>
    <asp:Panel ID="Panel2" runat="server">
        I'm Panel2
    </asp:Panel>
    
    protected void Button3_Click(object sender, EventArgs e)
    {
        string index = DropDownList1.SelectedValue.ToString();
    
        if (index == "1") {
            ModalPopupExtender1.Show();
        }
        else if (index == "2")
        {
            ModalPopupExtender2.Show();
        }
    }
    

    Best Regards,

    Fei Han




    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, October 12, 2015 9:58 PM
  • User-640323567 posted

    Thanks Fei. It worked like a charm! :)

    Tuesday, October 13, 2015 10:47 AM