从数据列表中选中的单选按钮打开 ModalPopupExtender

Open a ModalPopupExtender from checked radiobutton in a datalist

我有一个带有来自代码隐藏的绑定数据的数据列表,我正在尝试向每个项目添加一个 ajax modalpopupextender。此 modalpopup 需要打开右侧面板,问题是目标控件 id 在页面末尾始终是相同的按钮。

我正在选择单选按钮,但无法打开与其等效的模式弹出窗口。它总是打开第一个面板。

谁能帮帮我?这甚至可能吗?

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:我试过像这样将自定义字符串添加到面板 ID <%# DataBinder.Eval(Container.DataItem, "id") %> 。但这甚至无法编译。是否有机会完成这项工作?

您使用服务器端 OnClick 事件来显示弹出窗口。它仅显示在页面呈现期间评估的第一个(或最后一个)数据。

要更改 ModalPopup 的内容,您需要使用 OnClientClick 事件 + 异步调用来用您需要的数据填充弹出窗口。 Here is the example 通过 ModalPopup 使用客户端事件。