Tuesday, 05 February 2013 13:54

how to show jquery popup from code behind on page load asp.net

Written by 
Rate this item
(1 Vote)

you may want to show smooth jquery popup when user visited
your site or on a button click in any page,etc... from code behind.

i am here sharing codes for showing popup using jquery properly -

in body of page add the popup div which will be shown as popup when
user visited your site -

<div id="div_anonymous_popup" style="text-align:center;background-color: White;display:none; padding:20px;">
// content here
</div>

in head section write the following script codes.Before that jquery & jquery UI script
declarations needed -

<script type="text/javascript">
var dlg_pop;
function ShowPopUpDialog() {
dlg_pop = $('#div_anonymous_popup').dialog({
autoOpen: false,
modal: true,
width: 'auto',
height: 'auto',
title: 'Welcome'
});

$('#div_anonymous_popup').dialog('open');
dlg_pop.parent().appendTo('form');
}
</script>

then in code behind in Page_Load method -

runjQuery("ShowPopUpDialog();");

other related methods -

private string getCode(string jsCodetoRun)
{
StringBuilder sb1 = new StringBuilder();
sb1.AppendLine("function pageLoad() {");
sb1.AppendLine(jsCodetoRun);
sb1.AppendLine(" };");
return sb1.ToString();

}
private void runjQuery(string jsCodeforRun)
{
ScriptManager requestSM = ScriptManager.GetCurrent(Page);
if (requestSM != null && requestSM.IsInAsyncPostBack)
{
ScriptManager.RegisterStartupScript(this, typeof(Page), Guid.NewGuid().ToString(), getCode(jsCodeforRun), true);
}
else
{
Page.ClientScript.RegisterStartupScript(typeof(Page), Guid.NewGuid().ToString(), getCode(jsCodeforRun), true);
}
}

If you have any questions about that post or any topic, post your questions in
discussions/forum section in this website, you will get your answer
.
Hope that help very much.don't forget to give +1 in google search and share it.

Read 8665 times Last modified on Monday, 19 August 2013 14:40
Super User

Email This email address is being protected from spambots. You need JavaScript enabled to view it.
Login to post comments