background image disappears after using button in postbacktrigger of update panel in asp.net
Question
Background image disappears after using button in postbacktrigger of update panel in asp.net.I have designed registraion form and have placed all controls in update panel.After clicking on submit button,data gets submitted ,the page refreshes and background image dissappears.The values are getting properly inserted in database. PFB the HTML code for Registration.aspx:-
<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="Register.aspx.cs" Inherits="Register" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<%@ Register Src="~/UserControls/FacebookUserControl.ascx" TagName="facebookheader" TagPrefix="Uc1"%>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<style type="text/css">
.auto-style1 {
width: 100%;
}
</style>
<script type="text/javascript">
function HideCtrl(ctrl, timer) {
var ctry_array = ctrl.split(",");
var num = 0, arr_length = ctry_array.length;
while (num < arr_length) {
if (document.getElementById(ctry_array[num])) {
setTimeout('document.getElementById("' + ctry_array[num] + '").style.display = "none";', timer);
}
num += 1;
}
return false;
}
</script>
<script>
$(function () {
// Initialize Backgound Stretcher
$('BODY').bgStretcher({
images: ['images/slide-1.jpg'],
imageWidth: 1600,
imageHeight: 964,
resizeProportionally: true
});
});
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<form id="form1" runat="server">
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>
<section id="content">
<div class="main-block">
<div class="container_12">
<div class="wrapper">
<table>
<tr>
<td>
<asp:ValidationSummary ID="ValidationSummary1" runat="server" ValidationGroup="vg1" HeaderText="Fields marked with (*) are required"
ForeColor="Red" CssClass="error" />
</td>
</tr>
<tr>
<td>
<div id="divErrorMess" runat="server" visible="false" class="mess">
<asp:Label ID="lblMessage" runat="server" ForeColor="Red" Visible="False"></asp:Label>
</div>
<div id="divBallon" runat="server" visible="false" class="mess">
<div>
<asp:Label ID="lblMessage2" runat="server" Visible="False" ForeColor="Red"></asp:Label>
</div>
</div>
</td>
</tr>
</table>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<table style="width:358px; border:0;">
<tr>
<td> Full Name</td>
</tr>
<tr>
<td> <asp:TextBox ID="txtFullName" runat="server" placeholder="Enter your Full Name" ValidationGroup="vg1" Width="250px"></asp:TextBox>
<span style="color:red">*</span>
<asp:RequiredFieldValidator ID="rfvFullName" runat="server" ErrorMessage=""
ControlToValidate="txtFullName" Display="None" ForeColor="Red" SetFocusOnError="True"
ValidationGroup="vg1"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td> Date Of Birth</td>
</tr>
<tr>
<td> <%--<asp:TextBox ID="txtDateOfBirth" runat="server" placeholder="Enter your Date Of Birth" ValidationGroup="vg1" Width="250px" ClientIDMode="Static">
</asp:TextBox>--%><%-- <span style="color:red">*</span> <asp:CalendarExtender ID="CalendarExtender1" runat="server" Format="MM-dd-yyyy"
TargetControlID="txtDateOfBirth"></asp:CalendarExtender>--%><%-- <asp:RequiredFieldValidator ID="rfvDob" runat="server" ErrorMessage=""
ControlToValidate="txtDateOfBirth" Display="None" ForeColor="Red" SetFocusOnError="True"
ValidationGroup="vg1"></asp:RequiredFieldValidator>--%><asp:DropDownList ID="ddlMonth" runat="server" OnSelectedIndexChanged="ddlMonth_SelectedIndexChanged" placeholder="Month" AutoPostBack="true">
</asp:DropDownList> <span style="color:red">*</span>
<asp:RequiredFieldValidator ID="rfvMonth"
runat="server" ErrorMessage="*" ControlToValidate="ddlMonth" ForeColor="Red"
SetFocusOnError="True" ValidationGroup="vg1"></asp:RequiredFieldValidator>
<asp:DropDownList ID="ddlDate" runat="server" AutoPostBack="true">
</asp:DropDownList> <span style="color:red">*</span>
<asp:RequiredFieldValidator ID="rfvDate"
runat="server" ErrorMessage="*" ControlToValidate="ddlDate" ForeColor="Red"
SetFocusOnError="True" ValidationGroup="vg1"></asp:RequiredFieldValidator>
<asp:DropDownList ID="ddlYear" runat="server" OnSelectedIndexChanged="ddlYear_SelectedIndexChanged" AutoPostBack="true">
</asp:DropDownList> <span style="color:red">*</span>
<asp:RequiredFieldValidator ID="rfvYear" runat="server"
ErrorMessage="*"
ForeColor="Red" SetFocusOnError="True" ValidationGroup="vg1"
ControlToValidate="ddlYear"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td> Phone Number</td>
</tr>
<tr>
<td> <asp:TextBox ID="txtPhoneNumber" runat="server" placeholder="Enter your Phone Number" ValidationGroup="vg1" Width="250px">
</asp:TextBox>
<span style="color:red">*</span>
<asp:RequiredFieldValidator ID="rfvPhone" runat="server" ErrorMessage=""
ControlToValidate="txtPhoneNumber" Display="None" ForeColor="Red" SetFocusOnError="True"
ValidationGroup="vg1"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="revPhone" runat="server" ErrorMessage="Enter only 10 digit number"
ControlToValidate="txtPhoneNumber" Display="None" ForeColor="Red" SetFocusOnError="True"
ValidationExpression="^[0-9]{10}" ValidationGroup="vg1"></asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td> Email Address</td>
</tr>
<tr>
<td> <asp:TextBox ID="txtEmail" runat="server" placeholder="Enter your Email address" ValidationGroup="vg1" Width="250px">
</asp:TextBox>
<span style="color:red">*</span>
<asp:RequiredFieldValidator ID="rfvEmail" runat="server" ErrorMessage=""
ControlToValidate="txtEmail" Display="None" ForeColor="Red" SetFocusOnError="True"
ValidationGroup="vg1"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="revEmail" runat="server" ErrorMessage="Invalid Email!"
ControlToValidate="txtEmail" Display="None" ForeColor="Red" SetFocusOnError="True"
ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ValidationGroup="vg1">
</asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td> Submit 2 Photos</td>
</tr>
<tr>
<td> <asp:FileUpload ID="FileUpload1" runat="server" Width="250px" />
<span style="color:red">*</span>
<asp:RequiredFieldValidator ID="rfvPhoto1" runat="server" ErrorMessage=""
ControlToValidate="FileUpload1" Display="None" ForeColor="Red" SetFocusOnError="True"
ValidationGroup="vg1"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td> <asp:FileUpload ID="FileUpload2" runat="server" Width="250px"/>
<span style="color:red">*</span>
<asp:RequiredFieldValidator ID="rfvPhoto2" runat="server" ErrorMessage=""
ControlToValidate="FileUpload2" Display="None" ForeColor="Red" SetFocusOnError="True"
ValidationGroup="vg1"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td> Terms & Conditions</td>
</tr>
<tr>
<td> <asp:CheckBox ID="chkAgree" runat="server" /> I agree to Terms and Conditions</td>
</tr>
<tr>
<td> <asp:ImageButton ID="btnSubmit" runat="server" ImageUrl="~/images/submit.png" OnClick="btnSubmit_Click" ValidationGroup="vg1" />
<asp:ImageButton ID="btnReset" runat="server" ImageUrl="~/images/reset.png" CausesValidation="False" OnClick="btnReset_Click" />
</td>
</tr>
<tr>
<td> </td>
</tr>
</table>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ddlMonth" EventName="SelectedIndexChanged" />
<asp:AsyncPostBackTrigger ControlID="ddlDate" EventName="SelectedIndexChanged" />
<asp:AsyncPostBackTrigger ControlID="ddlYear" EventName="SelectedIndexChanged" />
<asp:PostBackTrigger ControlID="btnSubmit" />
</Triggers>
</asp:UpdatePanel>
</div>
</div>
<div class="sidebar">
<Uc1:facebookheader ID="fbtag" runat="server" />
</div>
</div>
</section>
<%-- </div> --%>
</form>
</asp:Content>
PFB code for Registration.aspx.cs:
The below code contains data for registration.aspx. In the below i have used dropdownlist to enter date as input and necessary validations are performed for date.I have used arraylist to add months and used for loop to add years.Also i have used CheckLeapYear fn to check leap year.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel.DataAnnotations;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.IO;
using System.Net.Mail;
using System.Collections;
public partial class Register : System.Web.UI.Page
{
int year;
string month;
protected void Page_Load(object sender, EventArgs e)
{
//System.Web.UI.HtmlControls.HtmlGenericControl divmain = (System.Web.UI.HtmlControls.HtmlGenericControl)Master.FindControl("divmain");
//divmain.Attributes.Add("class", "extra-block");
if (!IsPostBack)
{
this.Page.Title = "Register Us With Now to kick start your Career in MatureModelling";
this.Page.MetaDescription =
"MatureModelling connects new faces and models with scouts, international model photo "
+ "shoot and photographers. Casting Directors are now Looking"
+ " For real Models To Front Their Campaigns.";
this.Page.MetaKeywords =
"international photographers, expert model advice";
System.Web.UI.HtmlControls.HtmlGenericControl aRegister = (System.Web.UI.HtmlControls.HtmlGenericControl)Master.FindControl("Register");
aRegister.Attributes.Add("class", "current");
Response.Cache.SetNoStore();
DateTime tnow = DateTime.Now;
ArrayList ayear = new ArrayList();
int i;
for (i = 1970; i <= DateTime.Now.Year; i++)
{
ayear.Add(i);
}
ArrayList amonth = new ArrayList();
amonth.Add("Jan");
amonth.Add("Feb");
amonth.Add("Mar");
amonth.Add("Apr");
amonth.Add("May");
amonth.Add("Jun");
amonth.Add("Jul");
amonth.Add("Aug");
amonth.Add("Sep");
amonth.Add("Oct");
amonth.Add("Nov");
amonth.Add("Dec");
ddlYear.DataSource = ayear;
ddlYear.DataBind();
ddlMonth.DataSource = amonth;
ddlMonth.DataBind();
ddlYear.SelectedValue = tnow.Year.ToString();
ddlMonth.SelectedValue = tnow.Month.ToString();
year = Int32.Parse(ddlYear.SelectedValue);
month = Convert.ToString(ddlMonth.SelectedValue);
BindDays(year, month);
ddlDate.SelectedValue = tnow.Day.ToString();
}
}
#region Button Event
protected void btnSubmit_Click(object sender, ImageClickEventArgs e)
{
lblMessage.Text = "";
string strScript = string.Empty;
string strCtrl = divErrorMess.ClientID;
strScript = "HideCtrl('" + strCtrl + "', '3000')";
try
{
if (chkAgree.Checked)
{
Registration objRegistration = new Registration();
objRegistration.FirstName = txtFullName.Text.Trim().ToString();
//objRegistration.BirthDate = txtDateOfBirth.Text.Trim().ToString();
objRegistration.BirthDate = ddlYear.SelectedItem.Text.ToString()
+ "-" + ddlMonth.SelectedItem.Value.ToString()
+ "-" + ddlDate.SelectedItem.Text.ToString();
objRegistration.EmailId = txtEmail.Text.Trim().ToString();
objRegistration.PhoneNo = txtPhoneNumber.Text.Trim().ToString();
if (FileUpload1.HasFile)
{
objRegistration.Photo1 = DateTime.Now.ToString("ddMMyyyy") + FileUpload1.FileName.ToString();
}
string pathBig = Server.MapPath("~\\ModelPhotos\\" + DateTime.Now.ToString("ddMMyyyy") + FileUpload1.FileName.ToString());
ViewState["pathBig"] = pathBig;
if (File.Exists(pathBig))
{
//File.Delete(pathBig);
FileUpload1.SaveAs(pathBig);
}
else
{
FileUpload1.SaveAs(pathBig);
}
if (FileUpload2.HasFile)
{
objRegistration.Photo2 = DateTime.Now.ToString("ddMMyyyy") + FileUpload2.FileName.ToString();
}
string pathBig1 = Server.MapPath("~\\ModelPhotos\\" + DateTime.Now.ToString("ddMMyyyy")+FileUpload2.FileName.ToString());
ViewState["pathBig1"] = pathBig1;
if (File.Exists(pathBig1))
{
//File.Delete(pathBig1);
FileUpload2.SaveAs(pathBig1);
}
else
{
FileUpload2.SaveAs(pathBig1);
}
if (chkAgree.Checked)
{
objRegistration.IsAgree = "true";
}
else
{
objRegistration.IsAgree = "false";
}
RegistrationOperation objRegisterOperation = new RegistrationOperation();
int k = Convert.ToInt32(objRegisterOperation.InsertRegisterUser(objRegistration));
if (k==0)
{
divErrorMess.Visible = false;
divBallon.Visible = true;
lblMessage2.Visible = true;
lblMessage2.ForeColor = System.Drawing.Color.Green;
lblMessage2.Text = "User Created Successfully!";
lblMessage.Text = string.Empty;
Session["result"] = "insert";
// sendmail();
// sendmailtoadmin();
fnClearControls();
divBallon.Visible = true;
strScript="HideCtrl('"+divBallon.ClientID+"','3000')";
}
else if (k==1)
{
divErrorMess.Visible = true;
lblMessage.Visible = true;
lblMessage.ForeColor = System.Drawing.Color.Red;
lblMessage.Text = "Sorry,Please try again!";
divBallon.Visible = false;
}
else if (k==2)
{
divErrorMess.Visible = true;
lblMessage.Visible = true;
lblMessage.ForeColor = System.Drawing.Color.Blue;
lblMessage.Text = "Email Id already exists!";
divBallon.Visible = false;
}
}
else
{
divErrorMess.Visible = true;
lblMessage.Visible = true;
lblMessage.ForeColor = System.Drawing.Color.Orange;
lblMessage.Text = "Please accept terms & conditions";
divBallon.Visible = false;
}
}
catch (Exception ex)
{
throw ex;
}
Page.ClientScript.RegisterStartupScript(this.GetType(), Guid.NewGuid().ToString(), strScript, true);
}
protected void btnReset_Click(object sender, ImageClickEventArgs e)
{
fnClearControls();
divBallon.Visible = false;
divErrorMess.Visible = false;
}
#endregion
#region Private Method
private void fnClearControls()
{
txtFullName.Text = " ";
//txtLastName.Text = "";
txtPhoneNumber.Text = "";
// txtParentsPhoneNumber.Text = "";
txtEmail.Text = "";
chkAgree.Checked = false;
//txtDateOfBirth.Text = "";
ddlDate.SelectedIndex = 0;
ddlMonth.SelectedIndex = 0;
ddlYear.SelectedValue = Convert.ToString(DateTime.Now.Year);
}
public void FillDays()
{
ddlDate.Items.Clear();
//getting numbner of days in selected month & year
int noofdays = DateTime.DaysInMonth(Convert.ToInt32(ddlYear.SelectedValue), Convert.ToInt32(ddlMonth.SelectedValue));
//Fill days
for (int i = 0; i <= noofdays; i++)
{
ddlDate.Items.Add(i.ToString());
}
ddlDate.Items.FindByValue(System.DateTime.Now.Day.ToString()).Selected = true;
}
private bool CheckLeapYear(int year)
{
if ((year%4==0)&&(year%100!=0)||(year%400==0))
return true;
else return false;
}
private void BindDays(int year, string month)
{
int i;
ArrayList aday = new ArrayList();
switch (month)
{
case "Jan":
case "Mar":
case "May":
case "Jul":
case "Aug":
case "Oct":
case "Dec":
for (i = 1; i <= 31; i++)
{
aday.Add(i);
}
break;
case "Feb":
if (CheckLeapYear(year))
{
for (i = 1; i <= 29; i++)
aday.Add(i);
}
else
{
for (i = 1; i <= 28; i++)
aday.Add(i);
}
break;
case "Apr":
case "Jun":
case "Sep":
case "Nov":
for (i = 1; i <= 30; i++)
aday.Add(i);
break;
}
ddlDate.DataSource = aday;
ddlDate.DataBind();
}
#endregion
Following are dropdownlist events adn BindDays fn is used.
#region DDL events
protected void ddlYear_SelectedIndexChanged(object sender, EventArgs e)
{
year = Int32.Parse(ddlYear.SelectedValue);
month = Convert.ToString(ddlMonth.SelectedValue);
BindDays(year, month);
}
Following are dropdownlist events adn BindDays fn is used.
protected void ddlMonth_SelectedIndexChanged(object sender, EventArgs e)
{
year = Int32.Parse(ddlYear.SelectedValue);
month = Convert.ToString(ddlMonth.SelectedValue);
BindDays(year, month);
}
#endregion
}
1 answers
solution1
1 2014-01-02 14:27:30
It looks like you probably just need to call that JavaScript function that initializes your "Background Stretcher" on each UpdatePanel update (rather than just when the DOM loads). Changing that function to this should do the trick:
function pageLoad() {
$('BODY').bgStretcher({
images: ['images/slide-1.jpg'],
imageWidth: 1600,
imageHeight: 964,
resizeProportionally: true
});
}
Notice that I used function pageLoad() { (should be called on each postback, including AJAX partial postbacks) rather than $(function () { (only called once, when the DOM loads).
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.
Related Question
ASP.Net - The validation error inside update panel disappears after dropdown item change
Asp.net Display UpdateProgress on PostBackTrigger
update button is not firing in update panel in asp.net
background to panel in asp.net
How to make a gridView command field button into an ajax update panel PostBackTrigger
Button inside Update Panel is not triggered, in asp.net
asp.net submit button inside update panel and fileupload controls
Button click event is not firing inside Update Panel of ASP.NET
ASP.Net Panel to Image
Running script after Update panel AJAX asp.net
Related Tags