I am using the following method to redirect to the Item page and do a full page reload too. Works in all browsers, but Safari and IE (as always!). In those two, the current page gets reloaded.
Any recommendations on how to do it differently?
Item
I have also tried it in JS as follows, but the same problem occurs in Safari and IE
$scope.redirect = function(Item) {
window.location.href = '/items/' + item.$id;
window.location.reload();
}
Try this:
$(document).ready(function(){
// put all your js inside it
init();
});
also try by disabling cache parameter
To do it the way that you are doing, you should use the angular $window rather than window while in an angular controller. A good example of reloading the route or the whole window is here: AngularJs: Reload page
Alternatively I would consider have a button on the page:
<button ng-click="goItem(item.$id)" class="btn">Item</button>
which calls the action on the controller with the id as a parameter:
$scope.goItem = function(id){
$location.path('/items/' + id );
};
and redirects to the specific item route.
Having issues getting my one page web application to work in Internet Explorer and Edge. It works perfectly fine in other browsers.
The issue that I'm having is that I can't seem to get the navigation to work.
I've tried the following:
location.href = '#quickQuiz'
location.href = '/#quickQuiz'
window.location.href = '#quickQuiz'
window.location.href = '/#quickQuiz'
document.location.href = '/#quickQuiz'
document.location.href = '#quickQuiz'
function goHere(where) { window.location = where; return false; }
location.hash = '#quickQuiz'
location.hash = '/#quickQuiz'
All of them works perfectly fine on other browsers. What am I doing wrong?
http://www.snabbteori.se if you wanna see it for yourself.
EDIT1: Additional code
The item in my navigation menu looks like the following:
<li data-icon="info"><a id="teoriNav">Teori</a></li>
And then I check for a click event on it. I know that it's possible to just put href="#teori in there, but I am just using this one as an example, there are other links where I need to perform AJAX calls too, this one doesn't need it though just to verify there isn't something wrong with my AJAX calls causing it.
$(document).delegate('#teoriNav', 'click', function () {
location.hash('#teori');');
});
I've also tried this but doesn't work:
$('#teoriNav').click( function() {
location.hash('#teori');
});
EDIT2: Updates
I believe I've fixed all jQuery errors and some other issues. The only thing I'm getting in the Internet Explorer console is:
HTML1300: Navigation occured.
DOM7011: The code on this page disabled back and forward caching.
And then when I click on the button I get output which I wrote which confirms it registers my click on the button. But still it won't navigate.
EDIT3: Ugly temporary fix
It works after doing a page reload after navigating.
var isIE = /*#cc_on!#*/false || !!document.documentMode;
var isEdge = !isIE && !!window.StyleMedia;
if(isEdge || isIE)
location.reload();
But I hate the fact that the site has to reload, and if someone has a real fix for this I would really appreciate it...
Edge has an issue with links if your code is not propper. You should check your console for any errors, This is most likely.
We will need more information from your side to help you further.
Post your HTML and your Javascript (just relating to this area of problem)
and we can then better help you.
I sagest fixing your jQuery errors first and trying again.
Ok my Browser test have given me a variation of 30-60 error relating to jQuery across Mac to Win. These will need to be addressed.
You also have a XSS issue that needs to be resolved. You have HTTPS from facebook but then HTTP on your website, These will need to match.
I wrote the following code to redirect the user to different pages on click. While the following code works fine in chrome, but it does not work in IE or firefox.
However, when i open the same buttons in new tab, they work just fine. But with single left click they do not work on any browser other than chrome.
I tried variations like, window.location='url' and window.location.assign(url) and window.location.href="url" but to no avail.
Please if someone can help me.
if (this.href == "http://www.successlabs.pk/download.php") {
window.location.href= "http://www.successlabs.pk/download.php";}
else if (this.href == "http://www.successlabs.pk/ContactUs.html") {
window.location.href= "http://www.successlabs.pk/ContactUs.html";}
Thanks in advance.
this question is over a year old, but this is what worked for me:
function gotoPage(_link) {
var _link = 'http://www.successlabs.pk/download.php';
window.location(_link);
return false;
}
It's possible that adding the 'return false;' line is what will make it work for you. This SO page explains why.
From the horse's mouth: https://developer.mozilla.org/en-US/docs/Web/API/Window/location
Example #1: Navigate to a new page
Whenever a new value is assigned to the location object, a document
will be loaded using the URL as if location.assign() had been called
with the modified URL. Note that security settings, like CORS, may
prevent this to effectively happen.
location.assign("http://www.mozilla.org"); // or location =
"http://www.mozilla.org";
I have never used location.href before only the two examples given above - and they work in all browsers
I have a page that has a number of elements that are slid up on startup. I want to be able to slide down a particular pane based on the hash in the url my code is
if (window.location.hash.length>0){
var id = window.location.hash;
if (id.length==7){ //expected hash is 7 chars long (inc #)
console.log('Comment hash in url, finding link');
$(id).parents('.details_wrapper').parent().show().find('.details_wrapper').addClass('open').slideDown('slow', function(){ //unhide and slidedown pane
window.location.href = id;
});
}
}
Which sort of works in that the appropriate pane is revealed and slid down, however the window.location.href doesn't seem to be working very well as the window consistently places the page about 800px further down than where the anchor is.
As a possible side note it seems I can't verify the correct href as typing
window.location.href='#c83225';
into the developer console (Safari) gives an error. It works in the Chrome console though.
Another option to do that is
window.location.hash = 'c83225';
Background: I have an HTML page which lets you expand certain content. As only small portions of the page need to be loaded for such an expansion, it's done via JavaScript, and not by directing to a new URL/ HTML page. However, as a bonus the user is able to permalink to such expanded sections, i.e. send someone else a URL like
http://example.com/#foobar
and have the "foobar" category be opened immediately for that other user. This works using parent.location.hash = 'foobar', so that part is fine.
Now the question: When the user closes such a category on the page, I want to empty the URL fragment again, i.e. turn http://example.com/#foobar into http://example.com/ to update the permalink display. However, doing so using parent.location.hash = '' causes a reload of the whole page (in Firefox 3, for instance), which I'd like to avoid. Using window.location.href = '/#' won't trigger a page reload, but leaves the somewhat unpretty-looking "#" sign in the URL. So is there a way in popular browsers to JavaScript-remove a URL anchor including the "#" sign without triggering a page refresh?
As others have mentioned, replaceState in HTML5 can be used to remove the URL fragment.
Here is an example:
// remove fragment as much as it can go without adding an entry in browser history:
window.location.replace("#");
// slice off the remaining '#' in HTML5:
if (typeof window.history.replaceState == 'function') {
history.replaceState({}, '', window.location.href.slice(0, -1));
}
Since you are controlling the action on the hash value, why not just use a token that means "nothing", like "#_" or "#default".
You could use the shiny new HTML5 window.history.pushState and replaceState methods, as described in ASCIIcasts 246: AJAX History State and on the GitHub blog. This lets you change the entire path (within the same origin host) not just the fragment. To try out this feature, browse around a GitHub repository with a recent browser.
Put this code on head section.
<script type="text/javascript">
var uri = window.location.toString();
if (uri.indexOf("?") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("?"));
window.history.replaceState({}, document.title, clean_uri);
}
</script>
There is also another option instead of using hash,
you could use javascript: void(0);
Example: Open Div
I guess it also depends on when you need that kind of link, so you better check the following links:
How to use it: http://www.brightcherry.co.uk/scribbles/2010/04/25/javascript-how-to-remove-the-trailing-hash-in-a-url/
or check debate on what is better here: Which "href" value should I use for JavaScript links, "#" or "javascript:void(0)"?
$(document).ready(function() {
$(".lnk").click(function(e) {
e.preventDefault();
$(this).attr("href", "stripped_url_via_desired_regex");
});
});
So use
parent.location.hash = '' first
then do
window.location.href=window.location.href.slice(0, -1);
As others have said, you can't do it. Plus... seriously, as the jQuery Ajaxy author - I've deployed complete ajax websites for years now - and I can guarantee no end user has ever complained or perhaps ever even noticed that there is this hash thing going on, user's don't care as long as it works and their getting what they came for.
A proper solution though is HTML5 PushState/ReplaceState/PopState ;-) Which doesn't need the fragement-identifier anymore:
https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history
For a HTML5 and HTML4 compatible project that supports this HTML5 State Functionality check out https://github.com/browserstate/History.js :-)