Solved

How to show loading page after clicking submit button?

Posted on 2008-10-04
10
2,427 Views
Last Modified: 2010-04-21
Hello all,
 Maybe my topic is not right but I didn't know how could I describe it with a short sentence.
 What I would like to have ;

 I have got a normal order form, once member will click submit button;

 1. The Submit button name should change to Submit -> Processing...
 2. A new transparent page should appear and show loading image and I also would like to write some text.
 3. The page somehow should be protected from refreshing. Since the order will be delivered automaticly (taking the items from database and delivering).

 If page will refresh because of refreshing, database may deliver x2 - x3 more items, or wont deliver any items at all because it will find an error.
 
 I also would like to know if following wish is possible;
 New transparent page (layer) will do all process and when it is done, it will write;

 "Your order has been delivered. Click here to view your order"

 Thank you for your time and help.

Best regards,

 Thank you for your help and time.
0
Comment
Question by:pixalax
  • 5
  • 4
10 Comments
 
LVL 20

Expert Comment

by:Gawai
ID: 22644138
for Q 1 and 3
function validateFrm(){

document.processFrm.Process.disabled=true;

   document.processFrm.Process.value='Please Wait';

   document.processFrm.submit();

   return true;

}
 

<FORM NAME="processFrm" ACTION="process.asp" METHOD="post" onsubmit="return validateFrm()">
 

..

..

<INPUT id="Process" name="Process" type="submit"  value="Submit">

Open in new window

0
 
LVL 44

Expert Comment

by:scrathcyboy
ID: 22647185
You have to do this BEFORE you submit the form.  Use java script to submit the form, not the SUBMIT in the FORM tag, and just before you do the javascript submit, you write text or an image to a SPAN tag on the page (I do this all the time, so I know it works) -- but when the form submits, then the page WILL refresh.

"The page somehow should be protected from refreshing."

Can't do this easily.  You simply tell the user what has happened, an error, or the submit went through.  The whole point of a form is to tell the user that the action succeeded or did not, isn't the user entitled to know that his effort in your page got some results?

I think you need to rethink your logic.  Say you gave your CC info, name and address to some web page in good faith, and then it just siezed on you -- you would be ripped, and suspect them of fraud, right?
0
 
LVL 2

Author Comment

by:pixalax
ID: 22658200
There is nothing about paying money in this page. It is just taking some points from user's point in order to deliver the electronic items but still it will be better with higher security, all I want is ;
1. Proccessing... Please wait. text
2. User won't be able to refresh the page
3. Submit button should be pressed 2nd time.
0
 
LVL 20

Expert Comment

by:Gawai
ID: 22658601
did u try above code ?
0
 
LVL 2

Author Comment

by:pixalax
ID: 22668288
I tried thank you but, still I need some kind of layer showing up :(
Like when you try to delete the question a layer shows up, (transparent white page for example you can't click anything, just processing... please wait text and image I would like to put :)
0
Threat Intelligence Starter Resources

Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

 
LVL 20

Expert Comment

by:Gawai
ID: 22668968
0
 
LVL 20

Accepted Solution

by:
Gawai earned 500 total points
ID: 22669011
0
 
LVL 2

Author Comment

by:pixalax
ID: 22669813
Thank you for your answers and time.
What should I do now?
All answers are the solution some how? I am new here guys, sorry.
0
 
LVL 20

Expert Comment

by:Gawai
ID: 22672222
last one would be nice
0
 
LVL 2

Author Closing Comment

by:pixalax
ID: 31503102
Thank you..
Sorry for delay, just had too much work to do nowadays.
0

Featured Post

Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

Join & Write a Comment

This article discusses how to create an extensible mechanism for linked drop downs.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

746 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now