ModalPopupExtender внутри DataList отображается onclick of ImageButton внутри datalist item

Question

У меня есть datalist, заполненный элементами из базы данных, и у каждого элемента есть кнопка изображения, на которой я хочу показать modalpopup, содержащий описание конкретного элемента. Ниже то, что я до сих пор обедают, но не в состоянии:

<asp:DataList ID="DataList1" runat="server" RepeatColumns="3" RepeatDirection="Horizontal" Width="100%"> 

    <ItemTemplate> 
    <table width="228px"> 
    <tr> 
    <td width="20px" >&nbsp;</td> 
    <td width="160px" align="center"> 
    <asp:Label ID="pID" runat="server" Visible="false" Text='<%# Eval("id") %>'></asp:Label><asp:Label ID="Label1" runat="server" Text='<%# Eval("ProductName") %>' Font-Size="8pt" ForeColor="#336699" Width="100%" /> 
    </td> 
    <td align="right"> 
    &nbsp;&nbsp;<asp:ImageButton ID="SpecificBtn" ImageUrl="images/SmallCallout.png" OnClick="SpecificBtn_Click" CommandArgument='<%# Eval("Id") %>' runat="server" /> 
    <ajaxToolkit:ModalPopupExtender ID="mdl" runat="server" PopupControlID="pnl" TargetControlID="SpecificBtn" Enabled="True" CancelControlID="btn" DropShadow="true" Drag="True" ></ajaxToolkit:ModalPopupExtender>  
    </td> 
    </tr> 
    </table> 
    <asp:Image ID="Image1" runat="server" ImageUrl='<%# "GetImage.aspx?id=" + Eval("id") %>' /><br /> 
    <table align="center" style="position:relative; left:2px;" cellspacing="0" cellpadding = "0" width="228px"> 
    <tr> 
    <td style="background-color:Black;" colspan=2> 
    <div > 
    &nbsp;&nbsp; 
    <asp:Image ID="Image2" ImageUrl="/images/cart.png" runat="server" /> 
    <asp:Button CommandName="AddToCart" CssClass="anchor" OnClick="addProduct" CausesValidation="false" CommandArgument='<%# Eval("Id") %>' ID="addToHire" runat="server" Text="  Add To Cart  " BackColor="Black" BorderColor="Black" BorderStyle="None" ForeColor="#F8CD20" Height="24" Font-Bold="true" Font-Size="10" /> 
    </div> 
    </td> 
    </tr> 
    </table> 

    <br /><br /> 
    </ItemTemplate> 
    <ItemStyle CssClass="dataListItemStyle" HorizontalAlign="Center" VerticalAlign="Top" /> 
    </asp:DataList> 



<asp:Panel ID="pnl" runat="server" visible="false" Width="300px" Height="300px" BackColor="red"> 
     <asp:Label ID="Label2" runat="server" Text="Specification"></asp:Label> 
     <asp:Label ID="Label3" runat="server" Text='<%# Eval("Specification") %>'></asp:Label> 
     <asp:Button ID="btn" runat="server" Text="cancel" /> 
    </asp:Panel> 

код позади:

 protected void SpecificBtn_Click(object sender, EventArgs e) 
    { 
     DataListItem dli = (DataListItem)((ImageButton)sender).Parent; 
     ModalPopupExtender ModalPopupExtender2 = (ModalPopupExtender)dli.FindControl("mdl"); 
     pnl.Visible = true; 
     ModalPopupExtender2.Show(); 

    } 

Может кто-нибудь сказать мне, как добиться этого, и где я пошло не так. Благодарю.

Answer 1

использование JQuery ..

function onimagebuttonclick() 
    { 
     $find('BehaviorIDofmodelpopupextender').show(); 
    } 

я надеюсь, что это решит вашу проблему ..