Named Anchors and JavaScript

netman w00t's picture

He has: 9 posts

Joined: Jan 2005

I've been working on some PHP code recently, and it seems that web browsers don't send the part of the url past the # sign in any of the request headers. My PHP script needs to get this data somehow; can JavaScript get it? If not, is there perhaps some other way?

Thanks in advance!

Abhishek Reddy's picture

He has: 3,348 posts

Joined: Jul 2001

Possibly, depending how you're sending the data. Could perhaps use javascript to translate values in query string to anchors, or in reverse. Are you using POST for PHP to get data? In that case you could have javascript assign the anchor value to a hidden field. Similarly, cookies might be an option.

Could you give more details?

And welcome to TWF. Smiling

netman w00t's picture

He has: 9 posts

Joined: Jan 2005

Well, in this particular instance, the PHP script uses the request uri to make a frame. The problem arises when the user requests a uri with an anchor: the PHP script gets the host, file, and GET variables right, but the client doesn't send the anchor so it is omitted. The browser then searches for the anchor in the main window frame, which it of course cannot find - it needs to look in the frame instead (which requires that the anchor be in the frame uri), thus causing the browser to not scroll to the correct position.

To illustrate:

Say the client requests "http://myserver.net/foo/bar/baz.html#bottom" and my script handles this request. The script, in turn, generates approximately this html: (extraneous html omitted)

<html>
    <frameset>
        <frame name="main_frame" src="http://otherserver.net/other_dir/foo/bar/baz.html" />
    </frameset>
</html>

Notice how the frame's 'src' attribute has no anchor. I need some client-side script that can append the needed "#bottom" to the src string.

Thanks for the welcome and the response. Smiling

Abhishek Reddy's picture

He has: 3,348 posts

Joined: Jul 2001

How about this? Ensure that the client requests http://myserver.net/foo/bar/baz.html?go=bottom, which you can send back as http://otherserver.net/other_dir/foo/bar/baz.html#bottom.

I was asking how the request URL is built - is it static HTML? Are there many similar links? Automatically generated? Is it activated by a form submit?

Smiling

netman w00t's picture

He has: 9 posts

Joined: Jan 2005

The script is an improved frame redirector. The frontend script generates html for a frameset which directs the client to the real url. Living at that url, in turn, is another script (in this case a wrapper around a phpBB forum) that with some fancy regular expressions rewrites all the links so that they refer to the correct url and have the target set to "_top" so they load in the main window and cause the frame script to be called again. The whole process is completely transparent (assuming one doesn't look at the source of the page) because the browser's url bar always is correct. The only problem is when the user clicks a link with an anchor in the url.

My temporary solution has been to not include the "_top" target in links containing an achor, which causes the link to load in the frame and the browser to scroll correctly, but the url bar doesn't reflect this, and if the user types the url with the anchor, it has no effect.

As you said, rewriting the links to not use anchors would solve one part of the problem (user clicks link inside frame), but not the problem of the user requesting a document directly with the anchor in the url.

netman w00t's picture

He has: 9 posts

Joined: Jan 2005

Well, I've found the solution: With the added JavaScript, the page works just as it should.

<?php
    $target
= \"http://the.server.com/some/path\".$_SERVER['REQUEST_URI'];

   
$workable = array(\".html\",\".php\",\".htm\",\".shtml\",\".shtm\");

   
$file = ereg_replace(\"\?.*$\",\"\",$target);

    foreach(
$workable as $ext)
    {
        if(ereg(quotemeta(
$ext).\"$\",$file) || ereg(\"/$\",$file))
           
$ok = true;
    }

    if(!
$ok)
    {
        header(\"Location:
$target\");
        exit;
    }

<html>
    <head>
        <title>Static-Electric</title>
        <style type=\"text/css\">
            body {
                background: white;
                color: #A0A0A0;
                text-align: center;
            }
        </style>
        &lt;script language=\"JavaScript\"&gt;
        <!--
            /*
            ** Copyright (c) 2004 Bill R. Fraser <bill dot fraser at gmail dot com>
            ** This code is licensed under the Academic Free License as published by
            ** Open Source Initiative at <a href=\"http://opensource.org/licenses/afl-2.1.php\" class=\"bb-url\">http://opensource.org/licenses/afl-2.1.php</a>
            */
            function fix_anchor()
            {
                var loc = window.location.href;
                if(loc.indexOf(\"#\") >= 0)
                    var anch = loc.substring(loc.indexOf(\"#\"),loc.length);
                else
                    var anch = \"\";
                document.getElementById(\"main_frame\").src += anch;
            }
        -->
        &lt;/script&gt;
    </head>

    <frameset rows=\"100%,*\" frameborder=\"0\" onload=\"fix_anchor()\">
        <frame id=\"main_frame\" src=\" echo
$target; \" />
        <noframes>
            <body>
                <a href=\" echo
$target; \">continue...</a>
            </body>
        </noframes>
    </frameset>
</html>
?>

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.