Introduction
In my previous article, you learned about how to create a Model Popup in ASP.NET Application by using Ajax.
But my previous article was about opening a Panel in Model Popup, it might be possible that you want to use too many items or classes in the Model Popup in that case using a Panel can become hectic, in those cases you need to use a New WebForm as a Popup so my this article will show you how you can open a New Web Form in the Model Popup.
Step 1. If you are working on the previous application that was created in my previous article then you don't need to Add New add a new Ajax Toolkit for this article, and if you are Creating a New Web Application then first of all add an Ajax Toolkit that can be either downloaded from the Ajax Website or can be taken from the Zip File that I had provided at the beginning of this Article.
After attaching the Toolkit with the application you need to register this in your application which can be done by writing this code.
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
Step 2. Now you need to add a new Web Page to your application that you want to open as a Model Popup.
After adding the Web Page create a Form in the Web Page that will be filled by the End User in the Popup Window.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication26.WebForm2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<table>
<tr>
<td>
<asp:Label ID="Label1" runat="server" CssClass="lbl" Text="First Name"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox1" runat="server" Font-Size="14px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label2" runat="server" CssClass="lbl" Text="Middle Name"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox2" runat="server" Font-Size="14px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label3" runat="server" CssClass="lbl" Text="Last Name"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox3" runat="server" Font-Size="14px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label4" runat="server" CssClass="lbl" Text="Gender"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox4" runat="server" Font-Size="14px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label5" runat="server" CssClass="lbl" Text="Age"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox5" runat="server" Font-Size="14px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label6" runat="server" CssClass="lbl" Text="City"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox6" runat="server" Font-Size="14px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label7" runat="server" CssClass="lbl" Text="State"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox7" runat="server" Font-Size="14px"></asp:TextBox>
</td>
</tr>
</table>
</form>
</body>
</html>
Omid KaramiPosted Mar 18, 2021, 4:07 AM
Thanks about that Anubhav , what if we want to pass a parameter to the form2 and handel it in the form2 page load?
Amfahse AmfahsePosted Jan 30, 2021, 7:36 AM
Amfahs.com design websites and even develop apps for different types of operating systems. AMfahs build corporate web-based systems to help enterprises. https://amfahs.com
Nafisha YasminPosted Dec 3, 2020, 3:51 AM
Works Well...How to redirect from popup to another asp page? Using reponse.redirect shows the redirected page in popup. How to resolve it?
martin haryokoPosted Oct 25, 2020, 8:03 AM
Can this combine with gridview, when select / update / delete row
Brian.KiserPosted May 5, 2020, 11:12 AM
Can you do this with the close button on the popup itself, rather than from the calling page? I've implemented this now, but my form (in the AJAX popup) has both save and close buttons. I hate to have a save inside the popup, and a close centered outside the popup. it just looks goofy.
Brian.KiserPosted May 4, 2020, 12:21 PM
This works, but only if your form accepts no values or parameters. Is there a way to call this server side, so we can pass parameters to the form?
Alejandra DeLaTorrePosted Oct 25, 2019, 12:43 AM
This was great! I had been looking for a good example for this and it finally worked! Thanks.
Ronak shahPosted May 30, 2019, 12:40 AM
How i can pass string from main page to model view page ?
Carry TruthPosted Nov 14, 2018, 12:53 PM
So, using a different page, Page 2 in this instance, means that you have to control the actions / activity on that second page and somehow communicate back to Page 1. This presents significant comm issues. Rather than use a second page, use a Web User Control, having that control inside the popup panel. Ensure ClientIDMode is set to Static for all controls in that user control. Use Ajax to make the needed calls back to the server, all javascript either in a .js file or within the user control. And, yes, the Submit button for the modal popup should be on the page, not in the user control. Using a UserControl allows all the code and UI to be within it, including using <form id="frmRecord"> that has no runat so you can merely pass the form back in the ajax call to work with the data.
nitin gudalePosted Apr 13, 2018, 10:28 AM
Good one........,................
Alon ItachPosted Mar 1, 2018, 7:52 AM
Thank you! works very good. btw, if you like to hide the popup from the WebForm2 you need to use the BehaviorID property of ModalPopupExtender.
ChangPosted Feb 7, 2018, 4:41 PM
Thanks a lot, but how to bring the values of the text boxes from the model to our original page ?
Khanh HoangPosted Nov 1, 2017, 4:58 AM
Which version do you use? I use vs2010 when opening project then error
Nguyen Trong KhaPosted Oct 29, 2017, 10:35 PM
Thank You very much.....
Pradeep KumarPosted Aug 21, 2017, 6:50 AM
So easy to understand. ty..
Rezgui WahidPosted Jun 30, 2017, 8:20 PM
Very helpful thank you
Benchamaporn BuanarkPosted Mar 19, 2017, 11:31 PM
Helpful Thank you !!!!!!!
Shamim UddinPosted Sep 8, 2016, 12:15 AM
Nice
anuj srivastavaPosted Jun 14, 2016, 7:21 AM
Open a New Web Form in the Modal Popup of ASP.Net Application... where database and how to store database in Modal Popup of ASP.Net Application????
Parthiban KannanPosted Jun 12, 2016, 5:20 AM
Helpful article
Shirzad SharifPosted Apr 10, 2016, 6:32 AM
Awesome Article and Great Code! Thanks!!!
Gaurav ChhabraPosted Feb 12, 2016, 5:25 PM
Hello Anubhav, before anything thank you for such a nice guidance. Can you tell how we can get the values of the text boxes from the model to our original page ?
Hend AdelPosted Dec 9, 2015, 7:36 AM
I did that but it doesn't work.
Hend AdelPosted Dec 9, 2015, 5:36 AM
Thank You for this Article it was helpful. But I need to refresh the first page in close button or in submit button in the second form How can I do that?
Milan PetrovićPosted Nov 12, 2015, 5:37 PM
Nice code, but you may use it on Default.aspx, without using WebForm1.aspx, adding property BackColor="Gray" on sp:Panel ID="Panl1"... tag, as a background mask...
SharadPosted Jul 22, 2015, 12:38 AM
nice work... looking for Such case in ASP.NET MVC
Narayanan RamachandranPosted Mar 23, 2015, 5:49 AM
can you please help me to pass values to new aspx page, that is opened from <iframe > in ajax modal popup.My email id is [email protected]
Sumanth SharmaPosted Jan 22, 2015, 2:22 PM
Am not getting the pop up even i used the same code above
Abhijit PatilPosted Jan 21, 2015, 2:41 AM
hey anubhav,its very good and simple artical but i want to pass my query and bind data to gridview and after selection of row in grid revert back with current data and bind to textbox.please help me
mukesh gautamPosted Dec 31, 2014, 2:28 AM
its not working.showing error 1.The server tag is not well formed. <ajaxToolkit :ModalPopupExtender ID="mp1" runat="server" PopupControlID="Panl1" TargetControlID="Button1" CancelControlID="Button2" BackgroundCssClass="Background"></ajaxToolkit : ModalPopupExtender> showing element ajaxtoolkit is not supported.
javed AkhtarPosted Nov 12, 2014, 1:18 AM
Hi Anubhav ---i get this error when i run this code ...Could not load file or assembly AjaxControlToolKit Or its dependencies,The system cannot find the file specified. I puts <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %> in my MasterPage and <asp:scriptmanager id="ScriptManager1" runat="server"> </asp:scriptmanager> <asp:button id="Button1" runat="server" text="Button"></asp:button> <cc1:modalpopupextender id="mp1" runat="server" popupcontrolid="Panl1" targetcontrolid="Button1" cancelcontrolid="Button2" backgroundcssclass="BackgroundPopup"> </cc1:modalpopupextender> <asp:panel id="Panel1" runat="server"> <iframe style=" width: 350px; height: 300px;" id="irm1" src="Login.aspx" runat="server"></iframe> <br> <asp:button id="Button2" runat="server" text="Close"></asp:button> </asp:panel> ....This code in the Master pages in form.
ruchi matharuPosted Nov 1, 2014, 10:09 AM
Actually Anubhav i am trying to create a floating enquiry button in my website, since my website is moving, but background is constant, i want to place that button in the background , thus it should be seen in every page, making enquiry easy and user friendly button, but i am not getting idea as how to proceed , can you please guide me.
ruchi matharuPosted Oct 29, 2014, 10:12 AM
i am not getting popup on clicking the button please help me out understanding where i am going wrong
Ashwani RawatPosted May 29, 2014, 4:48 AM
My pop up form is not open. I have create two web form popup where I have paste form html code & second is popuptest where i have paste step 5 code. and change iframe src =popoup.aspx.
Anubhav ChaudharyPosted Nov 14, 2013, 3:49 AM
Sry, Srinvias VB is not my cup of Tea
srinvias surpurPosted Nov 13, 2013, 7:28 AM
HI Anubhav, I gone through your article, i am trying the same in VB can you please post similar code in VB
Abhishek SrivastavaPosted Nov 10, 2013, 6:34 AM
I was wondering if you have have tried returning the value when the popup closes. All the examples I am getting on search are about creating popup in the same form and not as a separate form.
Anubhav ChaudharyPosted Nov 6, 2013, 1:49 PM
Hi Abhishek, I'll definitely try to solve your problem as soon as possible.
Abhishek SrivastavaPosted Nov 6, 2013, 10:33 AM
Hi, based your article I have created a form and have some trouble passing value it. I have posted it as a question in this forum and would be grateful if you could have a look at it Here is the link for it http://www.c-sharpcorner.com/Forums/Thread/237084/pass-value-to-a-new-web-form-in-modal-popup.aspx
Anubhav ChaudharyPosted Oct 28, 2013, 1:23 AM
Hey Kida, I had worked on an Application which you can find on this Article "http://www.c-sharpcorner.com/uploadfile/cd7c2e/how-to-auto-refresh-grid-view-on-closing-of-popup-menu/" this might solve your Problem.
ali rajabiPosted Oct 1, 2013, 1:19 PM
thanks for your code. i have a question . how i can pass a parameter to WebForm2.aspx by querystring?
kida atlantisPosted Sep 13, 2013, 5:43 AM
Hi,when i tired running a Registration form with validation controls , its not showing the popup window at all.Can you please guide me where i went wrong?