Introduction:
Here I will explain how to display popup window on button click in asp.net using jQuery ui modal popup window or open jQuery modal popup window on button click in asp.net.
Description:
In previous articles I explained jquery show popup window during pageload, jquery simple modal popup window example, jQuery show alert message while leaving from website, jQuery enable / disable controls on page, jQuery Countdown timer script example and many articles relating to JQuery and asp.net. Now I will explain how to display popup window on button click in asp.net using jQuery ui modal popup window.
In previous articles I explained jquery show popup window during pageload, jquery simple modal popup window example, jQuery show alert message while leaving from website, jQuery enable / disable controls on page, jQuery Countdown timer script example and many articles relating to JQuery and asp.net. Now I will explain how to display popup window on button click in asp.net using jQuery ui modal popup window.
To show
popup window on button click we need to write the code like as shown below
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Show Modal Popup from code behind or server side</title>
<link type="text/css" rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"
/>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript">
$(function()
{
$('#<%=btnclick.ClientID%>').click(function() {
$("#popupdiv").dialog({
title: "jQuery
Popup from Server Side",
width: 430,
height: 250,
modal: true,
buttons: {
Close: function()
{
$(this).dialog('close');
}
}
});
return false;
});
})
</script>
</head>
<body>
<form id="form1"
runat="server">
<div>
<div id="popupdiv"
title="Basic
modal dialog" style="display: none">
<b> Welcome to Aspdotnet-Suresh.com</b>
</div>
<table align="center" style="margin-top:200px">
<tr>
<td>
<asp:Button ID="btnclick"
runat="server"
Text="Show Modal
Popup" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
|
Demo
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
|
|||
5 comments :
I m trying to open Popup in wordpress how?. because it's open in HTML..
Its really helpful post. Thanks.
hi, the code doest not work, can you please confirm ?
OnClick="Button1_Click"
and in cs file
protected void Button1_Click(object sender, EventArgs e)
{
Response.Write("Hello');
}
Server side events not working
if I use 1.11.0 version of jquery then it is not working
Note: Only a member of this blog may post a comment.