Solved

AJax Modal Popup Extender

Posted on 2010-11-27
7
900 Views
Last Modified: 2012-05-10
Does anyone have some sample code of opening an Ajax Modal Popup Extender by clicking a Link Button?  I have tried so many samples and I can't get any of them to work.   I am up against a deadline, so if you have some sample code that is working, I would greatly appreciate it.



0
Comment
Question by:sherbug1015
  • 4
  • 2
7 Comments
 
LVL 9

Expert Comment

by:TonyReba
ID: 34223796
What error are you getting?  Are you assigning a behavior id to the popup extender, for example...
<asp:LinkButton runat="server" ID="btnHiddenCompanyEmployeeController" />
<ajax:ModalPopupExtender BackgroundCssClass="modalBackground" ID="popUpCompanyEmployee"
  runat="server" PopupControlID="panelCompanyEmployee"
  TargetControlID="btnHiddenCompanyEmployeeController" BehaviorID="popUpCompanyEmployeeBehavior">

...and call up the show function using the behavior id, for example...

<asp:HyperLink runat="server" ID="HyperLink1" NavigateUrl="javascript:$find('popUpCompanyEmployeeBehavior').show();" Text="New Employee" />

Open in new window

0
 
LVL 16

Expert Comment

by:Kamal Khaleefa
ID: 34224261
here is the css

.modalBackground {
      background-color:Gray;
      filter:alpha(opacity=70);
      opacity:0.7;
}

.modalPopup {
      background-color:#ffffdd;
      border-width:3px;
      border-style:solid;
      border-color:Gray;
      padding:3px;
      width:250px;
}
<tr>
                    <td style="width: 100%; vertical-align: middle" colspan="2" align="center">
                        <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" BackgroundCssClass="modalBackground"
                                CacheDynamicResults="false" DropShadow="false" Enabled="true" EnableViewState="true"
                                TargetControlID="btnPreview" PopupControlID="PnlSelectCountry" PopupDragHandleControlID="PnlMove"
                                CancelControlID="btnExit">
                                                               
                        </cc1:ModalPopupExtender>
                    <asp:Panel ID="PnlSelectCountry" runat="server" Style="display: none">
                                <table style="font-size: 8pt; font-family: tahoma; background-color: white;">
                                    <tr>
                                        <td class="FormPopUPModel" colspan="2">
                                            <asp:Panel ID="PnlMove" runat="server" Style="cursor: move;">
                                                <table width="100%" border="0">
                                                    <tr>
                                                        <td align="right">
                                                            <asp:Button ID="btnExit" runat="server" CssClass="button" Text="close" ToolTip="close" />
                                                        </td>
                                                    </tr>
                                                      <tr>
                                                        <td align="right">
                                                       
                                                       <table width="100%">
                                                                    <tr>
                                                                         <td align="center" style="width: 10%;">
                                                                <asp:Button Height="20px" Style="display: none;" ID="Button1" Width="75px" CssClass="button"
                                                                    runat="server" Text="preview" />
                                                                <asp:Label ID="lblKeywords" runat="server" CssClass="FieldName" ToolTip="Key Search">Number:</asp:Label>
                                                            </td>
                                                            <td style="width: 20%;">
                                                                <asp:TextBox ID="txtKeywords" runat="server" CssClass="textbox_m" Height="16px" MaxLength="40"></asp:TextBox>
                                                                  </td>
                                                                        <td>
                                                                            <asp:Button ID="btnKeySearch" runat="server" CssClass="button" Font-Names="Tahoma"
                                                                                Height="20px"  
                                                                                Text="search" Width="75px" ToolTip="Search" />
                                                                        </td>
                                                                        <td>
                                                                           
                                                                        </td>
                                                                    </tr>
                                                                </table>
                                                       
                                                         </td>
                                                    </tr>
                                                    <tr>
                                                    <td align="center">
                                                  some text
                                                    
                                                    </td>
                                                    </tr>
                                                </table>
                                                
                                            </asp:Panel>
                                        </td>
                                    </tr>
                                </table>
                            </asp:Panel>
                    </td>
                    </tr>

Open in new window

0
 

Author Comment

by:sherbug1015
ID: 34225401
TonyReba - Your script does not work either.  Just using what you provided I get an error
Exception Details: System.InvalidOperationException: The control with ID 'popUpCompanyEmployee' requires a ScriptManager on the page. The ScriptManager must appear before any controls that need it.

Does this require a ScriptManager control?  If so, how is this done.  


 TestPopUp.txt
0
Efficient way to get backups off site to Azure

This user guide provides instructions on how to deploy and configure both a StoneFly Scale Out NAS Enterprise Cloud Drive virtual machine and Veeam Cloud Connect in the Microsoft Azure Cloud.

 

Author Comment

by:sherbug1015
ID: 34225449
king2002 - Your code has too much missing.  None of your CSSclasses are available and there are other problems.  Do you have something I can use out of the box?
0
 
LVL 9

Accepted Solution

by:
TonyReba earned 500 total points
ID: 34225666
Yes if you are using vs2008-2010. Drag and drop the ajax tool kit script manager control  anywhere in your page. That should get rid of that error
0
 

Author Comment

by:sherbug1015
ID: 34226047
TonyReba.  Thanks.  That worked fine.
0
 

Author Closing Comment

by:sherbug1015
ID: 34226049
Thanks.
0

Featured Post

What is SQL Server and how does it work?

The purpose of this paper is to provide you background on SQL Server. It’s your self-study guide for learning fundamentals. It includes both the history of SQL and its technical basics. Concepts and definitions will form the solid foundation of your future DBA expertise.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The Confluence of Individual Knowledge and the Collective Intelligence At this writing (summer 2013) the term API (http://dictionary.reference.com/browse/API?s=t) has made its way into the popular lexicon of the English language.  A few years ago, …
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
With Secure Portal Encryption, the recipient is sent a link to their email address directing them to the email laundry delivery page. From there, the recipient will be required to enter a user name and password to enter the page. Once the recipient …
Finds all prime numbers in a range requested and places them in a public primes() array. I've demostrated a template size of 30 (2 * 3 * 5) but larger templates can be built such 210  (2 * 3 * 5 * 7) or 2310  (2 * 3 * 5 * 7 * 11). The larger templa…

773 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question