Using <a anchor on same html page without reloading page.

12,406 views
Skip to first unread message

NoviceSortOf

unread,
Mar 18, 2009, 10:47:29 AM3/18/09
to Django users
We have a web form where the enduser clicks on a link and
is moved to different parts of the page.

With the previous 3 generations of the site, we simply did something
like the following .

...in html to mark the spot
<a top_of_page>

...in html to jump to the spot.
< href="/mypage#top_of_page">

Now with django when we click on the link re-posts the form, and then
jumps to the anchor - loosing any previous data entered into the form.

What options are their for doing this sort of page navigation linkage
on the same page in Django without reposting the page and loosing the
content of data fields that have already been filled in?

Adi Sieker

unread,
Mar 18, 2009, 11:18:58 AM3/18/09
to django...@googlegroups.com
Hi,

On 18.03.2009, at 15:47, NoviceSortOf wrote:

>
> We have a web form where the enduser clicks on a link and
> is moved to different parts of the page.
>
> With the previous 3 generations of the site, we simply did something
> like the following .
>
> ...in html to mark the spot
> <a top_of_page>
>
> ...in html to jump to the spot.
> < href="/mypage#top_of_page">
>

I'd guess that the href doesn't match the current url, so the browser
think it has to load the page in the href before being able to jump to
the
anchor. This doesn't really have much todo with django.

adi

NoviceSortOf

unread,
Mar 18, 2009, 11:59:00 AM3/18/09
to Django users
Thanks for the answer...

Looking closer and testing direct on the URL Navigation bar using cut
and paste figured out the following

A slash "/" between mypage/#top makes all the difference.

* this will reload the page, and go to the anchor.
http://127.0.0.1:8000/myproj/mypage#top

*this will just jump to the anchor...
http://127.0.0.1:8000/myproj/mypage/#top

Reiner

unread,
Mar 18, 2009, 5:52:47 PM3/18/09
to Django users
If the visitor should stay on the same page, you can leave out the url
and only specify the anchor in href.

<a href="#top"> ... </a>

The "problem" you've been facing here, probably is caused by the
APPEND_SLASH setting, enforced by the CommonMiddleWare I think. It's
used to ensure that a page has one, and only one, URL. www.example.com/blog
and www.example.com/blog/ deliver the same content, but the URL is
different. Therefore, incoming requests without a slash at the end are
redirected by the middleware.

So you *always* end up with a url like http://example.com/myproj/mypage/,
and therefore http://example.com/myproj/mypage#top was redirected
first. You better only specify the anchor, that way you don't have to
care about the page's URL at all.

Regards,
Reiner

On Mar 18, 4:59 pm, NoviceSortOf <dljonsson2...@gmail.com> wrote:
> Thanks for the answer...
>
> Looking closer and testing direct on the URL Navigation bar using cut
> and paste figured out the following
>
> A slash "/" between mypage/#top makes all the difference.
>
> * this will reload the page, and go to the anchor.http://127.0.0.1:8000/myproj/mypage#top
Reply all
Reply to author
Forward
0 new messages