How to prevent canonical URL's

Question

I have an anchor link on home.php which goes link this:

<a href='#?id=$thought_id' class='toggle-comment' data-id='$thought_id' '> Comments ($num_of_comments) </a>

When hovering over this anchor link, I expect to see results like this:

localhost/#?id=210

But what I am getting it this:

localhost/home.php#?id=211

I have seen a similar question here: But, having applied what the best answer suggests, I still get the same results. I also have the exact same anchor link present on profile_page.php and it works perfectly there.

The anchor link is not meant to go anywhere, on click, it dynamically enlarges the div below it, showing comments.

Edit:

How anchor link works:

when clicked, the anchor link expands the div below it. When clicked, this div appears: echo "<div id='toggleComment$thought_id' class='new_comment'>";
Then for each new comment added to this thought, another div is echo'd

<div class='new_comm' id='thoughtId".$thought_id."-childId".$comment['id']."'>

JavaScript to achieve this:

$(function() {
    $("a.toggle-comment").on("click", function(event) {
        // prevents browser to go to href's #
        event.preventDefault();
        // uses Jquery's data() function to get comment id from link's data-id attribute
        var id = $(this).data('id');       
        // get element by id and toggle display
        var ele = document.getElementById("toggleComment" + id);
        $(ele).toggle();
    });
});

Edit 2:

Came to a conclusion with Rocki in chat. The issue was that I have the JavaScript defined twice, once in the source code of home.php and once in functions.js which was also in the head of home.php. Removed the script from the source code, and code began to function.

score 2 · Accepted Answer · edited Oct 07 '21 at 11:04

2

Everything behind # is interpreted as the hash fragment and not send to the server. Instead your browser change the hash fragment for the current page.

RFC 2396: Uniform Resource Identifiers (URI): Generic Syntax

The character "#" is excluded because it is used to delimit a URI from a fragment identifier in URI references (Section 4).

https://www.rfc-editor.org/rfc/rfc2396

edited Oct 07 '21 at 11:04

Community

1
1

answered Apr 08 '16 at 15:46

Rocki

363
1
2
7

Sorry for the late response. I am still failing the understand why this issue occurs on one page and not in the other, where the exact same code is present? – Freddy Apr 11 '16 at 14:31
Is `profile_page.php` included by `index.php`? What the browser shows in the address bar matters. – Rocki Apr 11 '16 at 15:10
Sorry, but what do you mean by included by `index.php`? Also, the only link `index.php` and `home.php` have, is that when a user successfully logs in, it takes them to `home.php` (`header( "Location: home.php" );`) – Freddy Apr 11 '16 at 15:15
A lot of php apps use index.php to dispatch the request to correct handler (Dispatcher / Router Pattern). Simplified Example: `switch($_GET('site')) { case 'home': include('home.php'); break; ... }` – Rocki Apr 11 '16 at 15:22
Hmm, I honestly don't really know what to say, this is the first time I have came across URL routing and dispatching. Also, I don't know if you're asking if I have used either approach in `index.php`. Does this have anything to do with my `.HTACCESS` file? – Freddy Apr 11 '16 at 15:31
No .htaccess files are not related to dispatching / routing (except mod_rewrite for human readable url's). Does your address bar show `localhost/profile_page.php`? The default behavior (firefox, chrome, ...) should append/change the hash for the current address, thus `localhost/profile_page.php#?id=211` – Rocki Apr 11 '16 at 15:43
So when I go onto `profile_page.php` the URL states `http://localhost/profile_page/conor` (Conor being the username of the user logged in). And when I click onto the `comments` link, the URL stays the same. Would you like to discuss this in chat? I can provide you with a graphical representation of what is happening if that helps? – Freddy Apr 11 '16 at 15:47
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/108835/discussion-between-rocki-and-freddy). – Rocki Apr 11 '16 at 15:48

score 0 · Answer 2 · answered Apr 06 '16 at 15:02

0

use

<a href='/#?id=$thought_id' class='toggle-comment' data-id='$thought_id' '> Comments ($num_of_comments) </a>

instead (added / before your url)

answered Apr 06 '16 at 15:02

crashxxl

682
4
18

I have tried that, but for some reason, when I click the link then, it logs me out and sends me to `index.php`. – Freddy Apr 06 '16 at 15:05
so you are using some other javascript that has modified something, because normally that's how url works ! – crashxxl Apr 06 '16 at 15:06
Yes, so as mentioned, when the link is clicked, the div below it expands. I have used JavaScript to achieve this and will update my question to show my JavaScript. – Freddy Apr 06 '16 at 15:09

How to prevent canonical URL's

2 Answers2