AJAX Links

[alfred3x]

I'm developing a couple of AJAX-based data browsers, and I'm delighted with the response times and the look and feel of the pages. The one issue I'm having right now is with page positioning. When I click on a link which refreshes the browser with new content, it jumps back to the top of the page.

Ideally I'd like it to remain where it is.

The code for the link looks like so:

<a href="#" onclick="fetchCategories(this, 12345, 67890);"></a>

fetchCategories() returns false.

I'm guessing that just returning false doesn't seem to be enough. You actually have to put in a return false; at the end of the onclick.

Can someone explain why this is, and how this works?

Thanks.

[richtestani]

you can set the name of the anchor.

<a href=#stayhere" name="stayhere" onclick="fetchCategories(this, 12345, 67890); return false;" ></a>

I think that should work.

[alfred3x]

Thanks for that suggestion, rich, but that item actually gets trashed by the AJAX refresh. I'm trying to figure out how to not move the page at all, and putting a link like that specifically moves it.

[alfred3x]

OK, I figured it out! The original code was:

<a href="#" onclick="fetchCategories(this, 12345, 67890);"></a>

I tried moving the onclick JavaScript into href, but then that code shows up in the status bar. That's when I remembered javascript:void(0);. So the final code is:

<a href="javascript:void(0);" onclick="fetchCategories(this, 12345, 67890);">whatever...</a>

I'm not crazy about the javascript:void(0); appearing in the status bar, but I can live with that.

The only way the page jiggles now is when the code affects the length of the page.

Thanks for your help.
- AAA