mmalik15
asked on
how to use an animated gif in asp.net web form
hi experts,
I need to use an animated gif (attached) on a button click. I have used the image control like this on my webform
<asp:Image ID="ImageAjax" runat="server" ImageUrl="~/Images/ajax-lo ader.gif" AlternateText="Please wait" visible=false />
It displays a static image. Any ideas how to fix this
I need to use an animated gif (attached) on a button click. I have used the image control like this on my webform
<asp:Image ID="ImageAjax" runat="server" ImageUrl="~/Images/ajax-lo
It displays a static image. Any ideas how to fix this
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
i guess the problem occus on the postback on button click. I found a javascript solution to reload the image on postback but unable to do so. may be i need to do tweak my code for javascript. I am using c# and masterpage. My code is attached. I m trying to load the image again on runtime
<%@ Page Title="Life in the UK test - Register" Language="C#" MasterPageFile="~/MasterPageGenericWithSideBar.master"
AutoEventWireup="true" CodeFile="Register.aspx.cs" Inherits="PL_Register" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<script type="text/javascript">
document.title = "Life in the UK Test-Register";
</script>
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
</telerik:RadScriptManager>
<div style="padding-top: 8px; padding-left: 12px;">
<telerik:RadButton ID="RadButton1" runat="server" Text="Instructions" BackColor="#282872"
Width="100%" EnableEmbeddedSkins="true" Skin="Web20" Font-Size="10pt" Font-Names="verdana"
Font-Bold="true" BorderWidth="0px" Height="30px">
</telerik:RadButton>
<div style="border: solid; border-color: #D7D7D7; background-color: #D7D7D7; margin-bottom: 2px;
border-width: 1px 1px 1px 1px; line-height: 1.8em; width: 101%; height: 80%;
font-family: Verdana; font-size: 1em; font-weight: normal;">
<p style="padding-left: 5px; padding-top: 10px; font-size; padding-right: 5px; text-align: left;">
*Fill in your personal <b>e-mail ID e.g. bob.smith@hotmail.com </b>and please note
that all the test related communication will be sent to you on this email address.<br />
<br />
*Provide your <b>contact number</b> which can either be a mobile number or a landline
number with area code.
<br />
<br />
*Remember that <b>password</b> is case sensitive and it should be atleast six characters.
In case you forget the password it will be sent to you at your email address.<br />
<br />
*On completion of this form you will be taken to <b>paypal website</b> for the payment
and after the payment is complete you can start practising for the test.
<br />
<br />
*Your browser must accept <b>cookies</b> in order to successfully register and sign-in.
<br />
<br />
<a href="http://faq.external.bbc.co.uk/questions/bbc_online/cookies" target="_blank">
Learn how to enable cookies</a>
</p>
</div>
</div>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" runat="Server">
<script type="text/javascript" language="javascript">
function UpdateImg(ctrl, imgsrc) {
var img = document.getElementById(ctrl);
img.src = imgsrc;
}
</script>
<div style="height: 10px;">
</div>
<asp:Panel ID="pnlRegister" runat="server" Width="100%" Style="border: 1px; border-color: #D7D7D7;
border-style: solid; padding: 5px; height: 600px;">
<div style="height: 10px;">
</div>
<h1 style="margin-bottom: 3px;">
Register</h1>
<br />
<div style="background-color: White;">
<div class="GenericLabel">
<asp:Label ID="Label22" runat="server" Text="Title"></asp:Label>
<asp:Label ID="lblTitle" runat="server" Text="*" ForeColor="Red" Visible="false"
Font-Size="8pt" Font-Bold="true" Font-Names="verdana"></asp:Label>
</div>
<div class="GenericLabel" style="padding-bottom: 5px;">
<asp:DropDownList ID="ddlTitle" runat="server" AutoPostBack="false" Width="250px">
<asp:ListItem Selected="True"></asp:ListItem>
<asp:ListItem>Mr</asp:ListItem>
<asp:ListItem>Mrs</asp:ListItem>
<asp:ListItem>Ms</asp:ListItem>
<asp:ListItem>Miss</asp:ListItem>
<asp:ListItem>Other</asp:ListItem>
</asp:DropDownList>
</div>
<div style="height: 20px;">
</div>
<div class="GenericLabel">
<asp:Label ID="Label1" runat="server" Text="First name"></asp:Label>
<asp:Label ID="lblFirstname" runat="server" Text="*" ForeColor="Red" Visible="false"
Font-Size="8pt" Font-Bold="true" Font-Names="verdana"></asp:Label>
</div>
<div class="GenericLabel">
<asp:TextBox ID="txtFirstname" runat="server" Width="250px"></asp:TextBox>
</div>
<div style="height: 20px;">
</div>
<div class="GenericLabel">
<asp:Label ID="Label2" runat="server" Text="Surname"></asp:Label>
<asp:Label ID="lblSurname" runat="server" Text="*" ForeColor="Red" Visible="false"
Font-Size="8pt" Font-Bold="true" Font-Names="verdana"></asp:Label>
</div>
<div class="GenericLabel">
<asp:TextBox ID="txtSurname" runat="server" Width="250px"></asp:TextBox></div>
<div style="height: 20px;">
</div>
<div class="GenericLabel">
<asp:Label ID="Label11" runat="server" Text="Telephone no "></asp:Label>
<asp:Label ID="lblContactNo" runat="server" Text="*" ForeColor="Red" Visible="false"
Font-Size="8pt" Font-Bold="true" Font-Names="verdana"></asp:Label>
</div>
<div class="GenericLabel">
<asp:TextBox ID="txtTelephonenumber" runat="server" Width="250px"></asp:TextBox>
</div>
<div style="height: 20px;">
</div>
<div class="GenericLabel">
<asp:Label ID="Label6" runat="server" Text="Email"></asp:Label>
<asp:Label ID="lblEmail" runat="server" Text="*" ForeColor="Red" Visible="false"
Font-Size="8pt" Font-Bold="true" Font-Names="verdana"></asp:Label>
</div>
<div class="GenericLabel">
<asp:TextBox ID="txtEmail" runat="server" Width="250px"></asp:TextBox>
</div>
<div style="height: 20px;">
</div>
<div class="GenericLabel">
<asp:Label ID="Label8" runat="server" Text="Password"></asp:Label>
<asp:Label ID="lblPassword" runat="server" Text="*" ForeColor="Red" Visible="false"
Font-Size="8pt" Font-Bold="true" Font-Names="verdana"></asp:Label>
</div>
<div class="GenericLabel">
<asp:TextBox ID="txtPassword" runat="server" TextMode="Password" Width="250px"></asp:TextBox>
</div>
<div style="height: 20px;">
</div>
<div class="GenericLabel">
<asp:Label ID="Label9" runat="server" Text="Confirm Password"></asp:Label>
<asp:Label ID="lblConfirmPassword" runat="server" Text="*" ForeColor="Red" Visible="false"
Font-Size="8pt" Font-Bold="true" Font-Names="verdana"></asp:Label>
</div>
<div class="GenericLabel">
<asp:TextBox ID="txtConfirmPassword" runat="server" TextMode="Password" Width="250px"></asp:TextBox>
</div>
<br />
<br />
<div runat="server" id="DivOutput" visible="false">
<asp:ImageButton ID="ImageAjax" runat="server" ImageUrl="~/Images/ajax-loader.gif"
AlternateText="Please wait" Visible="true" />
<br />
<asp:Label ID="lblOutput" runat="server" Text="" class="GenericLabel" ForeColor="Red"
Visible="true"></asp:Label>
<br />
<br />
</div>
<div class="GenericLabel" style="text-align: left;">
<telerik:RadButton ID="btnSubmit" runat="server" Text="Subscribe" OnClick="btnSubmit_Click"
BackColor="#282872" Width="100px" EnableEmbeddedSkins="true" Font-Size="10pt"
Font-Names="verdana" Font-Bold="true" BorderWidth="1px" BorderColor="White" Height="30px">
</telerik:RadButton>
<br />
<div style="height: 10px;">
</div>
<div class="GenericLabel">
<asp:Label ID="Label3" runat="server" Text="Subscription Package £6.99"></asp:Label>
<asp:Label ID="Label4" runat="server" Text="*" ForeColor="Red" Visible="false" Font-Size="8pt"
Font-Bold="true" Font-Names="verdana"></asp:Label>
</div>
</div>
</div>
<div style="height: 30px; float: right">
<asp:Image ID="Image1" runat="server" ImageUrl="~/Images/paypalbuynow2.jpg.png" />
</div>
</asp:Panel>
<div runat="server" id="ShowResult" visible="false">
<h1 style="padding-top: 15px; margin-bottom: 5px;">
Register</h1>
<br />
<br />
<asp:Label ID="lblResult" runat="server" Text="" class="GenericLabel" ForeColor="Red"></asp:Label>
<div class="GenericLabel" style="text-align: left;">
<br />
<telerik:RadButton ID="btnContinue" runat="server" Text="Continue" Font-Names="Verdana"
OnClick="btnContinue_Click" Font-Size="10pt" ForeColor="#282872" Font-Bold="true"
Width="100px" Skin="Default">
</telerik:RadButton>
<br />
<br />
</div>
</div>
<div style="height: 20px;">
</div>
</asp:Content>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Text.RegularExpressions;
using System.Text;
using Quiksoft.FreeSMTP;
using CustomForm;
using System.Collections;
public partial class PL_Register : System.Web.UI.Page
{
protected void Page_PreInit(object sender, EventArgs e)
{
}
protected void Page_Load(object sender, EventArgs e)
{
btnSubmit.Attributes.Add("onclick", "setTimeout(\"UpdateImg('ImageAjax','Images/ajax-loader.gif');\",50);");
MaintainScrollPositionOnPostBack = true;
ArrayList alCust = new ArrayList();
Session.Add("CustList", alCust);
if (!Page.IsPostBack)
{
}
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
if (Validation())
{
string str= Guid.NewGuid().ToString();
Customer obj = new Customer();
obj.CustomerID =str.ToString();
obj.Title = ddlTitle.SelectedItem.Text.ToString();
obj.FirstName = txtFirstname.Text.ToString();
obj.Surname = txtSurname.Text.ToString();
obj.TelephoneNo = txtTelephonenumber.TemplateControl.ToString();
obj.Email = txtEmail.Text.ToString();
obj.Password = txtPassword.Text.ToString();
ArrayList alCust = (ArrayList)Session["CustList"];
alCust.Add(obj);
Session.Add("CustList", alCust);
Session["CustID"] = str.ToString();
//Response.Redirect("~/Payment.aspx");
DataClassesDataContext myContext = new DataClassesDataContext();
var i = myContext.SP_InsertCustomer(str.ToString(), ddlTitle.SelectedItem.Text, txtFirstname.Text, txtSurname.Text, txtTelephonenumber.Text, txtEmail.Text, txtPassword.Text, string.Empty, System.DateTime.Now, System.DateTime.Now, "False");
Response.Write(PayPalPostForm().ToString());
this.PayPalPostScript(Page);
DivOutput.Visible = true;
lblOutput.Text = "Please wait you will be redirected to paypal website in few seconds...";
ImageAjax.Visible = true;
btnSubmit.Enabled = false;
// //ClearFields();
//}
}
else
{
//lblOutput.Visible = true;
}
}
protected void btnRedirect_Click(object sender, EventArgs e)
{
Response.Redirect("~/Login.aspx");
}
protected void btnContinue_Click(object sender, EventArgs e)
{
Response.Redirect("~/Payment.aspx");
// Response.Redirect("~/Login.aspx");
}
protected void ClearFields()
{
ddlTitle.SelectedIndex = 0;
txtFirstname.Text = "";
txtSurname.Text = "";
txtEmail.Text = "";
txtTelephonenumber.Text = "";
txtPassword.Text = "";
txtConfirmPassword.Text = "";
}
protected bool Validation()
{
bool status = false;
int count = 0, emailcount = 0;
if (ddlTitle.SelectedItem.Text == "")
{
lblTitle.Visible = true;
count++;
}
else
lblTitle.Visible = false;
if (txtFirstname.Text == "")
{
lblFirstname.Visible = true;
count++;
}
else
lblFirstname.Visible = false;
if (txtSurname.Text == "")
{
lblSurname.Visible = true;
count++;
}
else
lblSurname.Visible = false;
if (txtEmail.Text == "")
{
lblEmail.Visible = true;
count++;
}
else
lblEmail.Visible = false;
if (txtTelephonenumber.Text == "")
{
lblContactNo.Visible = true;
count++;
}
else
lblContactNo.Visible = false;
if (txtPassword.Text == "")
{
lblPassword.Visible = true;
count++;
}
else
lblPassword.Visible = false;
if (txtConfirmPassword.Text == "")
{
lblConfirmPassword.Visible = true;
count++;
}
else
lblConfirmPassword.Visible = false;
if (String.IsNullOrEmpty(txtEmail.Text))
{
lblEmail.Visible = true;
count++;
}
else
{
lblEmail.Visible = false;
if (isEmail(txtEmail.Text) == false)
{
lblEmail.Visible = true;
count++;
}
if (CheckIfTheUserAlreadyExist())
{
lblEmail.Visible = true;
//lblEmail.Text = "you are already registered using this emailID.";
emailcount++;
}
}
if (txtPassword.Text != txtConfirmPassword.Text)
{
status = false;
count++;
}
if (count == 0 && emailcount == 0)
return true;
else
{
if (emailcount > 0)
{
DivOutput.Visible = true;
lblOutput.Visible = true;
lblOutput.Text = "You are already registered using this emailID";
return false;
}
DivOutput.Visible = true;
lblOutput.Visible = true;
lblOutput.Text = "Please complete the fields marked with *";
return false;
}
}
public bool isEmail(string inputEmail)
{
if (inputEmail == null || inputEmail.Length == 0)
{
throw new ArgumentNullException("inputEmail");
}
const string expression = @"^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}" +
@"\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\" +
@".)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$";
Regex regex = new Regex(expression);
return regex.IsMatch(inputEmail);
}
protected bool CheckIfTheUserAlreadyExist()
{
DataClassesDataContext myContext = new DataClassesDataContext();
var i = myContext.sp_CheckIfTheUserAlreadyExist(txtEmail.Text).ToString();
int j = Int32.Parse(i);
if (j > 0)
return true;
else
return false;
}
protected void SendConfirmationEmail()
{
string MailFrom, MailTo, MailMsg, MailSub;
MailFrom = "no-reply@practicelifeintheuktest.co.uk";
MailTo = txtEmail.Text.ToString();
MailSub = "Welcome to PracticeLifeInTheUKTest";
MailMsg = "Dear" + ' ' + txtFirstname.Text.ToString() + ' ' + txtSurname.Text.ToString() + ",<br /><br /> Thank you for registering with www.practicelifeintheuktest.co.uk. <br /><Br />Your account has been activated. If you have any problems accessing your account then please contact us at <Br /> support@lifeintheuktest.co.uk <Br /> <Br />Thank you<br /><b>www.practicelifeintheuktest.co.uk Support Team</b><br />";
//SMTP.QuickSend("ch.nes.scot.nhs.uk", MailTo, MailFrom, MailSub, MailMsg, BodyPartFormat.Plain);
DT_SendEmail obj = new DT_SendEmail(MailTo, MailFrom, MailSub, MailMsg);
obj.SendEmailWithOutCC();
}
public string PayPalPostForm()
{
//PayPal cart version
string PostUrl = "https://www.sandbox.paypal.com/cgi-bin/webscr";
string cmd = "_xclick";
string business = "seller_1317425768_biz@hotmail.co.uk";
string lc = "GB";
string item_name = "PracticeLifeInTheUKTest.co.uk";
string amount = "6.99";
string currency_code = "GBP";
string button_subtype = "services";
string no_note = "0";
string bn = "PP-BuyNowBF:btn_paynow_SM.gif:NonHostedGuest";
string CustID = Session["CustID"].ToString();
//Create the Form to write to the page with PayPal parameters
StringBuilder ppForm = new StringBuilder();
ppForm.Append("<Form name=" + "\"" + "frmPP" + "\"" + " id=" + "\"" + "frmPP" + "\"" + " action=" + "\"" + PostUrl + "\"" + " method=" + "\"" + "post" + "\"" + ">");
ppForm.Append("<input type=" + "\"" + "hidden" + "\"" + " name=" + "\"" + "cmd" + "\"" + " value=" + "\"" + cmd + "\"" + ">");
ppForm.Append("<input type=" + "\"" + "hidden" + "\"" + " name=" + "\"" + "business" + "\"" + " value=" + "\"" + business + "\"" + ">");
ppForm.Append("<input type=" + "\"" + "hidden" + "\"" + " name=" + "\"" + "lc" + "\"" + " value=" + "\"" + lc + "\"" + ">");
ppForm.Append("<input type=" + "\"" + "hidden" + "\"" + " name=" + "\"" + "item_name" + "\"" + " value=" + "\"" + item_name + "\"" + ">");
ppForm.Append("<input type=" + "\"" + "hidden" + "\"" + " name=" + "\"" + "custom" + "\"" + " value=" + "\"" + CustID + "\"" + ">");
ppForm.Append("<input type=" + "\"" + "hidden" + "\"" + " name=" + "\"" + "amount" + "\"" + " value=" + "\"" + amount + "\"" + ">");
ppForm.Append("<input type=" + "\"" + "hidden" + "\"" + " name=" + "\"" + "currency_code" + "\"" + " value=" + "\"" + currency_code + "\"" + ">");
ppForm.Append("<input type=" + "\"" + "hidden" + "\"" + " name=" + "\"" + "button_subtype" + "\"" + " value=" + "\"" + button_subtype + "\"" + ">");
ppForm.Append("<input type=" + "\"" + "hidden" + "\"" + " name=" + "\"" + "no_note" + "\"" + " value=" + "\"" + no_note + "\"" + ">");
ppForm.Append("<input type=" + "\"" + "hidden" + "\"" + " name=" + "\"" + "bn" + "\"" + " value=" + "\"" + bn + "\"" + ">");
ppForm.Append("</Form>");
return ppForm.ToString();
}
private void PayPalPostScript(System.Web.UI.Page Page)
{
//This registers Javascript to the page which is used to post the PayPal Form details
StringBuilder strScript = new StringBuilder();
strScript.Append("<script language='javascript'>");
strScript.Append("var ctlForm = document.getElementById('frmPP');");
strScript.Append("ctlForm.submit();");
strScript.Append("</script>");
Page.ClientScript.RegisterStartupScript(this.GetType(), "PPSubmit", strScript.ToString());
}
}
ASKER
<div runat="server" id="DivOutput" visible="false">
<asp:ImageButton ID="ImageAjax" runat="server" ImageUrl="~/Images/ajax-lo
AlternateText="Please wait" Visible="false" />
<br />
<asp:Label ID="lblOutput" runat="server" Text="" class="GenericLabel" ForeColor="Red"
Visible="true"></asp:Label
<br />
<br />
</div>
on my code behind in button click event i have
DivOutput.Visible = true;
ImageAjax.Visible = true;
the image loads the animation starts for a second or so and then stops
any ideas why