Welcome to WebmasterWorld Guest from

Forum Moderators: open

Message Too Old, No Replies

anchors with onclick's and buttons with onclicks



3:42 am on Aug 20, 2009 (gmt 0)

5+ Year Member

suppose i have...

<script type="text/javascript">
function someAjax() {

/* an ajax call here.. when the ajax comes back successful it returns true or if its unsuccessful it returns false */

return ;

<a href="page.php" onclick="return someAjax()">Anchor</a>

.... a click on the anchor will do this in this order
-act like its loading a page (the important part)
-make the ajax call
-when the ajax call is successful it follows the link
-if the ajax is unsuccessful, nothing happens

i'm trying to duplicate that with the click of a <button> or the change of an input field. the part i'm missing is when the user clicks the button the browser just sits and waits for the ajax call to finish then on success it starts to load the new page.

is it possible to make the browser act like its loading a page? or mimic an anchor click in javascript? i tried wrapping an anchor around a button, but that doesn't work in IE. I'm using Prototype if that helps/hurts.


4:30 am on Aug 20, 2009 (gmt 0)

WebmasterWorld Senior Member eelixduppy is a WebmasterWorld Top Contributor of All Time 10+ Year Member

I would check in your callback function, that when the XML request has returned successfully, that you redirect at that moment, using something like the following:

document.location = 'page.php';

You never want to say something like "well this browser does it this way" because you never know if that will be the same behavior on another browser, perhaps another version, or whatever the case may be. You always want to know exactly what is going to happen and when. Doing it the way I explain should achieve this effect.


5:05 am on Aug 20, 2009 (gmt 0)

5+ Year Member

thats exactly what i did for the button scenario.... the only side effect is when the user clicks the button, the browser doesn't act like its doing anything until the ajax completes and then it redirects. I want the user to be able to tell their click is doing its thing.


4:25 pm on Aug 20, 2009 (gmt 0)

WebmasterWorld Senior Member whoisgregg is a WebmasterWorld Top Contributor of All Time 10+ Year Member

All AJAX applications have that problem. Most of us "solve" it by adding a little animated gif (called a "spinner") near whatever object triggered the event. So if they click a link, have spinner appear next to the link, until the AJAX request resolves itself.


6:37 pm on Aug 20, 2009 (gmt 0)

5+ Year Member

I was leaning toward a solution like that... but i was thinking a "wait" cursor, so i did a...

document.body.style.cursor = 'wait' ;

but if the body doesn't fill the window, its the arrow cursor in the non-body part of the window. whats the proper way to do this?

...but back to my original question, is there a way to maybe create a fake link with js, then have javascript perform a 'click' action on it so the page acts like its loading. then my script would do its thing and return true or false to the link so its followed or not.


Featured Threads

Hot Threads This Week

Hot Threads This Month