Hi,
I have a DataList in which I am displaying images from the database. I have added a ModalPopupExtender within the ItemTemplate of the DataList to open the larger version of the image I am clicking on.
But the only image that works is the first one. When I click on it, the popup opens fine. But none of the other images open the popup.
My aspx code is below:
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="frmPhotos.aspx.vb" Inherits="AJAXWebApp.frmPhotos" %><%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="cc1" %><!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"><title></title><link href="cssBackground.css" rel="stylesheet" /><script type="text/javascript">
function pageLoad() {
var mpe = $find("MPE");
mpe.add_shown(onShown);
}
function onShown() {
var background = $find("MPE")._backgroundElement;
background.onclick = function () {$find("MPE").hide();
}
}
function modalPopupLoad() {
var hovermenu = $find("HME");
hovermenu._hoverBehavior._hoverElement.style.visibility = "hidden";
}</script></head><body><form id="form1" runat="server"><div style="align-content:center"><asp:ScriptManager ID ="scriptMgr1" runat="server"></asp:ScriptManager><asp:UpdatePanel ID="updatePanelMain" runat="server"><ContentTemplate><asp:DataList ID ="dlPhotos" runat="server" RepeatColumns="6" RepeatDirection="Horizontal" Width="60%"><ItemTemplate><asp:ImageButton ImageUrl='<%#Eval("FileName")%>' runat="server" ID="img" Height="125" OnClick="thumbnail_Click" /><asp:Panel ID ="pnlMainImage" runat="server" Height="150" Width="150" HorizontalAlign="Center" style="display:none"><asp:Image ID ="imgMain" runat="server" Height ="90%" ImageUrl='<%#Eval("FileNameMain")%>' /></asp:Panel><cc1:modalpopupextender id="ModalPopupExtender1" runat="server" BehaviorID="MPE"
targetcontrolid="img" popupcontrolid="pnlMainImage"
drag="true" backgroundcssclass="ModalPopupBG"><Animations><OnShown><Sequence><Parallel><Resize height="700" width="900"></Resize><Move Horizontal="-300" Vertical="-300"></Move></Parallel></Sequence></OnShown></Animations></cc1:modalpopupextender></ItemTemplate></asp:DataList></ContentTemplate></asp:UpdatePanel></div></form></body></html>Am I missing something?