Welcome to WebmasterWorld Guest from 54.234.38.8

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)

Junior Member

5+ Year Member

joined:Jan 18, 2008
posts:99
votes: 0


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 ;
}
</script>

<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)

Senior Member

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

joined:Nov 12, 2005
posts:5966
votes: 0


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)

Junior Member

5+ Year Member

joined:Jan 18, 2008
posts:99
votes: 0


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)

Senior Member

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

joined:Dec 9, 2003
posts:3416
votes: 0


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)

Junior Member

5+ Year Member

joined:Jan 18, 2008
posts:99
votes: 0


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.