Introduction :- The ModelPopupExtender control enables you to display the simple text of the page content of the user by displaying a model pop-up window.When the pop-up window appears,the remainder of the web page grays out,preventing you from interacting with page.However, at that time, you can interact with the pop-up window contents.This (ModelPopupExtender) popup is fired by onclick event on the target controls.
There are some properties of ModelPopupExtender Control as given below:-
Step 1 :- First open your visual studio --> File --> New -->Website -->Select ASP.NET Empty Website -->OK --> Add New Page(Default.aspx) --> drag and drop ToolkitScriptManager Labels, Buttons and Radio Button controls as shown below:-
There are some properties of ModelPopupExtender Control as given below:-
- TargetControlIID :- It sets the ID of the control that activates the model-pop-up.
- PopupControlIID :- It sets the ID of the control that is displayed as a model pop-up.
- DropShadow:- It determines whether the model pop-up has a drop shadow effect or not.
- OkControlId :- It sets the Id of the control that dismisses the model pop-up.You can use it.
- OnOkScript :- It specifies the script to run when the model pop-up dismissed the OkControlId property.
- CancelControlID:- It sets the ID of the control that cancel the model pop-up.
- OnCancelScript:-It specifies the script to run when the model pop-up dismissed the OnCancelScript property.
- BackgroundCssClass:- It sets the Css class that be applied to the background when the model model pop-up has displayed.
- X :- It Sets the X coordinate at the top/left corner of the model pop-up.
- Y:- It sets the Y coordinate at the top/left corner of the model pop-up.
- RepositionMode :- It sets the reposition mode that determines if the model pop-up needs to be repositioned when the window is resized or scrolled.
Step 2 :- Now Go Design View and drag and drop ModelPopupExtender control. Now sets its properties as shown below:-
Step 3 :- See all design codes :-
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<asp:Button ID="Button1" runat="server"
style="font-weight: 700; background-color: #FF99FF" Text="Go Here"
Width="162px" />
<br />
<asp:Label ID="Label7" runat="server" style="font-weight: 700; color: #FF0000"
Text="*"></asp:Label>
<br />
<asp:Panel ID="Panel1" runat="server" Height="193px" Width="907px">
<span class="style1">Select Your Favorite Company...</span><br /> Microsoft
<asp:RadioButton ID="RadioButton1" runat="server" GroupName="ram" />
<br />
<asp:Label ID="Label2" runat="server" Text="Google"></asp:Label>
<asp:RadioButton ID="RadioButton2" runat="server" GroupName="ram" />
<br />
<asp:Label ID="Label3" runat="server" Text="Facebook"></asp:Label>
<asp:RadioButton ID="RadioButton3" runat="server" GroupName="ram" />
<br />
<asp:Label ID="Label4" runat="server" Text="Yahoo"></asp:Label>
<asp:RadioButton ID="RadioButton4" runat="server" GroupName="ram" />
<br />
<asp:Label ID="Label5" runat="server" Text="Adobe"></asp:Label>
<asp:RadioButton ID="RadioButton5" runat="server" GroupName="ram" />
<br />
<asp:Label ID="Label6" runat="server" Text="Tcs"></asp:Label>
<asp:RadioButton ID="RadioButton6" runat="server" GroupName="ram" />
<br />
<asp:Label ID="Wipro" runat="server" Text="Wipro"></asp:Label>
<asp:RadioButton ID="RadioButton7" runat="server" GroupName="ram" />
<br />
<asp:Button ID="Button2" runat="server"
style="font-weight: 700; background-color: #99CCFF" Text="Submit"
Width="115px" onclick="Button2_Click" />
<br />
</asp:Panel>
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Button1"
PopupControlID="Panel1">
</asp:ModalPopupExtender>
</div>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button2_Click(object sender, EventArgs e)
{
if (RadioButton1.Checked)
{
Label7.Text = "You have Selected Microsoft..thank you..";
}
else if (RadioButton2.Checked)
{
Label7.Text = "You have Selected Google..thank you..";
}
else if (RadioButton3.Checked)
{
Label7.Text = "You have Selected Facebook..thank you..";
}
else if (RadioButton4.Checked)
{
Label7.Text = "You have Selected Yahoo..thank you..";
}
else if (RadioButton5.Checked)
{
Label7.Text = "You have Selected Adobe..thank you..";
}
else if (RadioButton6.Checked)
{
Label7.Text = "You have Selected TCS..thank you..";
}
else if (RadioButton7.Checked)
{
Label7.Text = "You have Selected Wipro..thank you..";
}
else
{
Label7.Text = "You have not selected any company..thank you..";
}
}
}
Step 5 :- Now Run the application (press F5)--> you will see following output as shown below:-
For More...
- Learn more C# concepts
- Learn asp.net concepts
- Learn SQL Server Concepts
- Learn Ajax Concepts
- Learn xml concepts
- Learn interview Questions
Download
0 comments:
Post a Comment