My client needs some decaf

I have a form that updates a mysql table and results in a PDF.  Works fine.

It takes a few seconds between the time a user submits the form and for all the "magic" to happen.

My client, the twitch that he is, keeps pounding on the submit button. I have the validateat set to submitonce. is there something I can easily display to show something akin to  "processing" that doesn't increase server load?
Short-Order-CoderAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

ddayx10Commented:
I take it you are sending off a request, and when it returns then you are displaying some results in an element somewhere?

Usually what is done is that just before you send the request you fill an element on the page with some img/text indicating a waiting state. Then when your request is returned the 1st thing you do is change that waiting state back to a default.

Maybe some code will help...

<input type="submit" onclick="sendRequest();return false;" value="Click Me" />
<div id="results"></div>


<script type="text/javascript">

function sendRequest()
{
   document.getElementById('results').innerHTML = "Please Wait, ya twitchy bastard!";
}

function firedWhenAjaxReturnsResponse(rObj)
{
   document.getElementById('results').innerHTML = rObj;
}
</script>

You could disable the button until a response returns, or put a background image in the button showing a wait state. The possibilities are unlimited. I can't be much more specific since I cant see your code, and I don't know exactly what it is you're doing with the button click. With the information I have I can just give you a general idea....

good luck,

dday





0
azadisaryevCommented:
yes, since you have not posted any code, it's hard to give you any detailed help...

but see if this works for you:

1) add this js function to the HEAD section of your page:
<script type="text/javascript>
checkForm = function(objForm) {
      objForm.submitbtn.disabled=true;
      document.getElementById('loading').style.display='';
      var formname = objForm.name;
      var fn = eval('_CF_check'+formname);
      //var formValid = ColdFusion.Ajax.checkForm(objForm, eval('_CF_check'+formname));
      var formValid = fn.call(null, objForm);
      if (formValid) {
            return true;
      } else {
            objForm.submitbtn.disabled=false;
            document.getElementById('loading').style.display='none';
            return false;
      }
}
</script>

2) this is your new submit button code. my button has ID and NAME as 'submitbtn' - change as necessary, but don;t forget to change it in the above javascript as well then!

<cfinput type="submit" name="submitbtm" id="submitbtn" value="update" onclick="return checkForm(this.form);" /><span id="loading" style="padding-left:10px; color:red; font-weight:bold; display:none;">PROCESSING... Please wait...</span>

the above code will run cf's built-in form validation (if you are using one) first, and submit the form if it validates.

if you are submitting your form via ajax post/get, then there may be a few changes need to be made to this code...

post your code and we'll help you more.

Azadi
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
eejonesCommented:
You could make a <div> that is initially empty, and when the user hits Submit some Javascript puts a "waiting.gif" type of animated GIF image in that div. You can Google to find free animated GIFs that would work - a bouncing ball, a spinning circle, etc. Google "loading.gif" or "waiting.gif"

The property you want is "innerhtml" - e.g.

onClick = "document.getElementById('mydiv').innerHTML='<img src=waiting.gif>' " 

This will put the animated image in the 'mydiv' div so the user can see something is happening.

Depending on the language, you can use ob_flush();flush(); (php) or <cfflush> (ColdFusion) to force some content to be written to the page right away, if it does not appear right away.
0
The Five Tenets of the Most Secure Backup

Data loss can hit a business in any number of ways. In reality, companies should expect to lose data at some point. The challenge is having a plan to recover from such an event.

Short-Order-CoderAuthor Commented:
would I need any additional javascript?
0
azadisaryevCommented:
did you try the code i posted for you?

Azadi
0
Short-Order-CoderAuthor Commented:
No.  I just got back into town.  I didn't even notice other answer.  my bad.  I'll go through this tomorrow.
0
eejonesCommented:
You could paste this snippet of code after the <body> tag in any .html test document and see how this works.

Also you can make your own animated gif at this url: http://www.ajaxload.info/ - and put that image into the divMessage div.

---------------------------------------------------

<form action="" method="post">
<input type="submit" name="submitbutton" value="Submit"
onClick="
this.disabled='true';
document.getElementById('divMessage').innerHTML='The form is being processed. Please be patient and do not click the Submit button again. You cannot, anyway, becauase it is disabled!';
 "
>
<div id="divMessage"></div>
</form>

0
azadisaryevCommented:
@eejones:

while your code will work in a simple environment with a simple form, it will not when used with a cfform and built-in cf form validation - your code will not enable the submit button if form validation fails, leaving user in a state when he can't make cjanges and submit the form again.

Azadi
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Servers

From novice to tech pro — start learning today.