Lucky
Lucky

Reputation: 111

Open a ModalPopupExtender from checked radiobutton in a datalist

I have a Datalist with binddata from code behind and I'm trying to add an ajax modalpopupextender to each item. This modalpopup needs to open the right panel with the problem that the target control id it's always the same button in the end of the page.

I am getting the radiobutton selected but i can't open the modalpopup that is equivalent to it. It always opens the first panel.

Can anyone help me? Is this even possible?

C#

    protected void btnValidateGift_Click(object sender, EventArgs e)
    {
        if (Request.Form["gift"] != null)
        {

        }
    }

aspx

<asp:DataList ID="datalistReward" runat="server" RepeatDirection="Vertical" RepeatColumns="3" CssClass="datalistGift">
    <ItemTemplate>
        <div class="giftDiv">
            <div class="giftTitle">
                <%# DataBinder.Eval(Container.DataItem, "name") %>
            </div>
            <div>
                <img width="60%" src="img/brindes/<%# DataBinder.Eval(Container.DataItem, "img") %>.png" />
            </div>
            <div id="divRadioBtnGift" runat="server" style="width: 10%; margin: auto;">
                <input type='radio' id='radioBtnGift_<%# DataBinder.Eval(Container.DataItem, "value") %>'
                    name='gift' value='<%# DataBinder.Eval(Container.DataItem, "id") %>' />
            </div>
        </div>
        <asp:ModalPopupExtender ID="ModalPopUpReward" BehaviorID="modalBehaviorPopupReward" runat="server" PopupControlID="panelSelectReward"
            CancelControlID="btnCloseReward" BackgroundCssClass="modalBackground" TargetControlID="btnValidateGift" />
        <asp:Panel ID="panelSelectReward" runat="server" CssClass="modalPopup" align="center" Style="display: none">
            <div style="background-color: aqua; border: 1px solid red;">
                <img width="60%" src="img/brindes/<%# DataBinder.Eval(Container.DataItem, "img") %>.png" />
                <asp:ImageButton ID="btnCloseReward" runat="server" Text="Close" OnClientClick="CloseModalPopUp()" />
            </div>
        </asp:Panel>
    </ItemTemplate>
</asp:DataList>

<asp:Button ID="btnValidateGift" Text="Validar >" runat="server" CssClass="divButton" OnClick="btnValidateGift_Click" />

Edit1: I've tried to add the a custom string to the panel id like this <%# DataBinder.Eval(Container.DataItem, "id") %> . But this doesn't even compile. Any chance of making this work?

Upvotes: 0

Views: 477

Answers (1)

Mikhail Tymchuk
Mikhail Tymchuk

Reputation: 896

You use server-side OnClick event to show the popup. It just shows the first (or last) data evaluated during page render.

To change ModalPopup's content you need to use OnClientClick event + asynchronous call to fill the popup with the data you need. Here is the example of using client events with ModalPopup.

Upvotes: 2

Related Questions