Loading ...

How to implement modal popup in datalist repeater | CodeAsp.Net

How to implement modal popup in datalist repeater

 /5
0 (0votes)

Here I discuss that how to implement modal popup in different data control like datalist and repeater.

To show the modalpopup in datalist/repeater we have to use the item command event of respective control.

 Data control:

 

<asp:DataList ID="dlst" runat="server" DataKeyField="ID" OnItemCommand="dlst_ItemCommand" >
        <HeaderTemplate>

        </HeaderTemplate>

        <ItemTemplate>

           <asp:Button ID="btnpopup" runat="server" CommandArgument='<%#Eval("ID") %>' CommandName="popup"   CausesValidation="false" />

        </ItemTemplate>

</asp:DataList>

/*you have to use a dummy button becuase the target control id can not be blank of modal pop up extender.*/

 

<div style="display: none">

     <asp:Button ID="btnDummy" runat="server" Text="Button" />

</div>


<ajaxToolkit:ModalPopupExtender ID="mpe1" runat="server" TargetControlID="btnDummy" PopupControlID="pnl1"
EnableViewState="true" />

<asp:Panel ID="pnl1" runat="server" Width="600px" Style="display: none">

/*your popup content goes here*/

</asp:Panel>


Code-behind:
 
protected void dlst_ItemCommand(object source, DataListCommandEventArgs e)
        {            
           
            if (e.CommandName == "popup")
            {          
                
                mpe1.Show();
               
            } 

       }

you can make modal poup conditional too.

 Eg.

 

If(condition)
	{
          mpe1.Show();
        }
else
       {
          mpe1.Hide();
        }



Note:  you can use the Show() and Hide() method of pop up control to show and hide the pop up.

 

Hope this will helps..........

Comments (4)

   
dpkngm
nice posting!!! keep it up
3/3/2009
 · 
by
   
site
Nice post, but half of it is chopped off by the ads on your website!
6/3/2009
 · 
by
   
EnrichJan
It helps a lot .. Nice one
6/10/2010
 · 
by
   
EnrichJan
It helps a lot.. Nice one
6/10/2010
 · 
by

Top Posts