[FX.php List] Visual cue when processing a long, multi-record edit request?

[Steve Winter]

Joel,

Let us assume that the form is contained thus;
  <div id="editForm">
    ...your form...
  </div>
and the processing area thus;
  <div id="processingNow" style="display: none">
    ...we're processing your submission...
  </div>

In your validate form script (for want of anywhere better to put it), just
before you return true to enable to form to submit, add the following two
lines;
  document.getElementById(processingNow).style.display = '';
  document.getElementById(editForm).style.display = 'none';

Which should have the desired effect...not tested, written off the top of
my head, think I got it right... (also not sure how valid/cross platform
it is, but think it should be pretty okay that way too, at least for
'modern' browsers)

Cheers
Steve

> Thanks so much, Steve, that's a great idea!
> 
> And thanks, Kevin, I agree that Steve's suggestion #1 is much better,  
> but why do you recommend against using an image and only using text?
> 
> Steve: I've played some with hiding/showing <div>s, but just in  
> direct links so far (e.g. <a href="javascript:toggleLayer('2');"> )  
> and not in form submissions (my form is already using javascript for  
> validation:
> <form method="post" action="edit.php" name="form" onsubmit="return  
> validateForm(this)">
> 
> If you've got any examples of toggling the form <div> to Hidden and  
> the "Processing..." div to Display, I'd love to see one.
> 
> Thanks very much,
> -Joel
> 
> 
> On Oct 12, 2005, at 4:10 PM, Kevin Futter wrote:
> 
> > I'd advise you go for the first option, as it's more accessible  
> > (provided
> > you use text for "Processing" instead of an image), and won't run  
> > afoul of
> > errant popup blockers or confuse screenreaders like the second. I  
> > use this
> > approach all the time for hiding and displaying error messages.
> 
> 
> On Oct 12, 2005, at 3:29 PM, Steve Winter wrote:
> 
> > Joel,
> >
> > It seems that you're happy using Javascript, so there are a couple of
> > options which spring to mind just now.
> >   1. Place the form that users fill in inside a <div> tag which has  
> > an id,
> > associated with it.  Place a 'processing' graphic inside another
> <div>
> > (with id) which usually has 'display' set to none.  When the user  
> > clicks
> > your submit button, run a short piece of javascript, which sets the
> > content <div> to display: none, and the 'processing' <div> to
> display.
> > Then when the process finishes and the next page loads it clears.
> >   2. Use javascript to open another small window, placed in the  
> > center of
> > the users screen when they submit the form. put some sort of loading
> > graphic in there. When the next page loads, have further javascript  
> > inside
> > there that closes that window donw.
> >
> > Let me know if you want more details about either of these
> ideas...I'm
> > also sure other people will have other suggestions too ;-)
> >
> > Cheers
> > Steve
> >
> >
> >> Hi all
> >>
> >> I've got a page that allows users to edit many related records all
> at
> >> once (via radio buttons).  Unfortunately, the browser stays on the
> >> editable page -- sometimes for up to 30 seconds -- after clicking
> >> submit.  I'm wondering if there's some way I can display some kind
> of
> >> "processing..." message or animated gif after submitting, instead of
> >> leaving the user staring at the page he/she just submitted (and
> >> wondering if anything is happening).
> >>
> >> Or is there a way to have the browser switch to the processing page
> >> right away, and I could put my message/gif on that page?
> >>
> >> (I already have a note next to the Submit button.  I know I could
> >> have a javascript alert pop-up, but I'd rather users not have to
> >> click OK again after clicking 'Submit'.... Maybe even something like
> >> a javascript pop-up window that then closes upon completion??)
> >>
> >> I know this isn't specifically FX.php, but I'm hoping someone might
> >> have a suggestion.
> >>
> >> TIA
> >>
> >> -Joel
> >> _______________________________________________
> >> FX.php_List mailing list
> >> FX.php_List at mail.iviking.org
> >> http://www.iviking.org/mailman/listinfo/fx.php_list
> >>
> >
> >
> > _______________________________________________
> > FX.php_List mailing list
> > FX.php_List at mail.iviking.org
> > http://www.iviking.org/mailman/listinfo/fx.php_list
> >
> 
> _______________________________________________
> FX.php_List mailing list
> FX.php_List at mail.iviking.org
> http://www.iviking.org/mailman/listinfo/fx.php_list