Question

I have the below code inside the datalist control

  <a  id="lnkCart" runat="server" onclick="lnkCart_Click" title='<%#DataBinder.Eval(Container.DataItem,"BookId")%>'>
         <img src="images/cart.gif" id='<%#DataBinder.Eval(Container.DataItem,"BookId")%>'
               alt="" title="" border="0" class="left_bt" />

       </a>

Now I want that on click of the above link I would show the modal pop up, but this modal popup should load the information from the database based on the book Id which I can get from the title of the ‘a’ link. So, that I need to get the BookId at the server side and have to load the content in the panel which is need to be updated. Can it be easy by using the modal pop up extender?

How can I do that.

Answer 1

Yes, you will have to put panel and fill this panel from “ItemDataBound” property of datalist by fetching bookid. See below code

 protected void dlalbumlist_ItemDataBound(object sender, System.Web.UI.WebControls.DataListItemEventArgs e)
        {


            if (e.Item.ItemType == ListItemType.Item ||
                     e.Item.ItemType == ListItemType.AlternatingItem)
            {
// Code to fill panel from bookid using findcontrol get hyperlink 
            }

        }

    <ajaxToolkit:ModalPopupExtender ID="mdl" runat="server" PopupControlID="pnl" TargetControlID="lnkCart" CancelControlID="btn" BackgroundCssClass="modalBackground" ></ajaxToolkit:ModalPopupExtender>    
    <asp:Panel ID="pnl" runat="server" style="display:none;" Width="300px" Height="300px"   BackColor="red">
    <asp:Button ID="btn" runat="server" Text="cancel" />