Link to home
Start Free TrialLog in
Avatar of mmalik15
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-loader.gif" AlternateText="Please wait" visible=false />

It displays a static image. Any ideas how to fix this


 User generated image
ASKER CERTIFIED SOLUTION
Avatar of dexterrajesh
dexterrajesh
Flag of India image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of mmalik15
mmalik15

ASKER

thanks for the comment my html where i have used it is
<div runat="server" id="DivOutput" visible="false">
                <asp:ImageButton ID="ImageAjax" runat="server" ImageUrl="~/Images/ajax-loader.gif"
                    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
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>

Open in new window

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());
    }


   
}

Open in new window