1

My application is a single page application ,I am using links like shown below

<a class="list-group-item navigationlink" href="#" id="roletemplates-link" data-moduleid="2">Role Templates</a>

You can see that href="#". On clicking that link I use ajax to load content to the page.

I want to append "#" to URL when I click that link without reloading the page. In many solutions I saw is like that the page will have to be reloaded if we want to append some values to variables.

My Question:

Is it possible to append the "#" to URL on clicking the link without reloading the page?

Rino Raj
  • 6,264
  • 2
  • 27
  • 42
  • 1
    you can preevent the default and append the `#` using javascript, then update the `location/href` – atmd Aug 24 '15 at 14:11
  • What happens when you click with `href="#"`. I don't think it reloads, does it? – Selvakumar Arumugam Aug 24 '15 at 14:24
  • No.. But when I searched for " how to append data to URL " I found something like http://stackoverflow.com/questions/12781345/add-parameters-to-an-url-from-a-a-href-just-clicked .. here the page will reload if I use this solution. So I wanted to avoid that. – Rino Raj Aug 24 '15 at 14:27
  • I don't think it will reload with just `href="#"`. If it has a valid ID then for sure it won't reload (ex: `href="#roletemplates-link'`) and you will see the page getting scrolled to the element. – Selvakumar Arumugam Aug 24 '15 at 14:29
  • @Vega at present its not reloading. But "#" is not appending to URL.. I want to append "#" to URL – Rino Raj Aug 24 '15 at 14:31
  • 1
    @RinoRaj `href="#"` will append a `#` when you click on it, but it won't if you have a `preventDefault` or a `return false` in your event handler. – Selvakumar Arumugam Aug 24 '15 at 14:35
  • @Vega I am using preventDefault – Rino Raj Aug 24 '15 at 14:43

3 Answers3

3

This can be done via Javascript:

window.location.hash = "myfancynewhashtag";
Tom Doodler
  • 1,471
  • 2
  • 15
  • 41
0

Save your string '#' or anything in a hidden element and add it in the url directly by adding a function on onclick.

hope it works.

Mark Ola
  • 305
  • 2
  • 12
  • Can you show a demo for appending "#" without reloading the page? – Rino Raj Aug 24 '15 at 14:44
  • your Link

    please check it and change it accordingly.

     – Mark Ola Aug 24 '15 at 14:58
0

It is very much possible that you can append # to the url.

Now the url can be same or different.

In case of same url:

It won't refresh the page at all. Instead, it will search for the fragment identifier in the same and it will scroll to that portion of the page.

In case of different url:

It will reload the page and scroll to the portion of the page for which fragment identifier is mentioned after the #.

Hope that this answers your question.

LJNielsenDk
  • 1,414
  • 1
  • 16
  • 32
Parashuram
  • 1,498
  • 2
  • 16
  • 36
  • Put this in an html file and i promise you it works: http://pastebin.com/cYeSYA5L – Rino Raj Aug 24 '15 at 15:41
  • did it refresh the page for you? it did not for me and it won't for sure.It will append the #.I never said it won't add # to the url.What i have explained above is,what happens after adding # to the url. – Parashuram Aug 24 '15 at 15:57