I have a JQuery Mobile app and for some reason the history.back() button is now causing the browser window to go back, rather than it going back to the previous JQuery Mobile DOM page.
Has anyone else experienced this, or does anyone have suggestions on where to look? Unfortunately I can't use data-rel="back" as I need to call the back action programatically.
Note: I'm not ruling out that maybe I changed something to cause this to behave differently. (I was toying with trying to get paths to show in the browser URL. Perhaps that conflicts with history.back()? )
I see some other people with this issue at http://forum.jquery.com/topic/trouble-with-history-back-in-jquery-mobile-application, so for now I've implemented my own primitive "back" history system. If anyone else has experienced this issue, though, I'm open for a proper fix.
Related
I've been creating a portfolio website for a friend. In an attempt to make the site responsive and artsy, I chose to pull in twitter bootstrap and skrollr. I noticed that in safari in iOS that the site seems to be cut off at a certain point. Has anyone else ran into this issue before? I have provided a link below in case anyone notices anything obvious.
http://jennaparysek.com/
Thanks!
A lot of people (including myself) are having troubles when using skrollr on mobile devices. In order to use both "fixed" and "relative/absolute" position at the same time, you have to put all the divs that are not fixed inside a div called #skrollr-body
However, the real problem is that your skrollr is being confused when getting the height of your
skrollr-body. you can try to put forceHeight: false inside your skrollr.init()
if that doesn't work, it might because skrollr doesn't know where is the end of #skrollr-body, so just put an empty div after your #skrollr-body and give it a keyframe. It should works just fine now :)
Have been bashing my head against the wall for a good day and a half now. Did everyone abandon old fashioned page structures to go to jQuery Mobile?
I have a webpage, tracks legislation. Main navbar goes as such:
/bills/list, /legislators/list, /committees/list
Where each link is rewritten into
index.php?category=$1&detail=$2
so /bills/list translates to
index.php?category=bills&detail=list
But when I load a page from the navbar, using an a href tag, the pages load all nice and easy using the AJAX loader, but the newly loaded pages 1. don't run scripts, and 2. don't display any formatting. This is a problem.
All the suggestions I have seen say to .bind something or .refresh or .trigger without any context of where that goes, and everything I have tried in that vein has frustrated me to no end.
Please help! And by the way, if I just data-ajax=false everything it works perfectly. But I want the quick loading that ajax gives! I just don't understand how it works and there are really no good pointers on the web I could find.
Code in this pastebin: http://pastebin.com/9jMxV0B6
You can see some artifacts of my struggling to get the thing working.
From what I gather, you shouldn't call new pages via a href, but then why the hell does jqm use href's for its nav menu? Is that supposed to call a function or something?
"But when I load a page from the navbar, using a basic old fashioned a href tag, the pages load all nice and easy using the AJAX loader, but the newly loaded pages 1. don't run scripts, and 2. don't display any formatting. This is a problem."
That happens because JQM ignores all the headers in all other pages besides the first page that loads. So if you want to do any changes to the page use page events, place them In first page.
I had problems understanding it also. Here is a link to my previous post that explains it a bit: How do I enable onload in jQuery mobile (open page both from link & load)?
Hope it clears some things for you. My recommendation for you is to do two simple pages and test simple URL functionality.
I need to point one page to another and then scroll to a particular section. In Chrome and Firefox, using an URL like www.example.com#section1 does the trick. (#section1 can be an anchor or an element's id).
However, in Safari, the hash disappears when I click the link.
Why is this happening? Is it possible to do it on Safari? If not, how can I get around this problem?
When using hyperlinks that point to inside sections on other pages you must remember to add a slash (/) before the hashtag for cross browser compatibility.
Eg: www.example.com/#item-1
doing www.example.com#item-1 isn't accepted by all browsers (apparently by Chrome and Firefox it is)
Case: I have parameters after '#' like url#myParam=123, when I changed params like
url#myParam=789 Safari sometimes loaded previous page based on myParam=123,
although in Address bar it showed myParam=789
Solution : Use url?#myParam=123, then Safari will everytime load new page.
Using '?' before '#' solved my problem.
I had a related problem with Safari (on iPhone/iOS) seemingly stripping off the hash/fragment when doing a:
var newHash = ...;
window.location.replace("#" + newHash);
The actually problem was a javascript error that only appeared on Safari. Since I could not easily assess a javascript console for the iPhone, I chose to download an old version of Window's Safari (related post, download).
Then, I could replicate the problem from the iPhone on my Window's desktop using the old version of Safari. At that point, I found a javascript tag had a missing ']'. This was a legitimate bug, but it was somehow ignored by Chrome, Firefox, and IE.
The window.location.replace() was not even being called, because the code was breaking out on the javascript error. So the problem wasn't that Safari was stripping the hashtag, even though it appeared that way from multi-browser testing.
I just experienced an issue like this. I was using a URL re-write in the asp.net web.config. With Safari, the hash and everything after was removed. After trying some of the things mentioned above I was still having problems. The issue for me was that this was all happening under HTTPS. Once I specified the full URL in the redirect and included the https:// scheme the redirect worked correctly and preserved the hash. Note this wasn't an issue with Chrome or Firefox.
For me it was the exact same issue like mrbinky3000 has stated above: The server mod-rewrite was killing the hash in safari.
The solution was to use a full absolute link like:
http://www.example.com/path/#item-1
My JQM app has a page in it called "settings" which has three buttons serving as links to other pages. One of those pages is called "tracks" and the code for it is below.
Control your relaxation resources
When I click this button I get a "File not found" error and the browser is pointing to the "file:///C:/inetpub/wwwroot/SITES/jQuery%20Mobile%20Form/tracks#tracks" url rather than the "file:///C:/inetpub/wwwroot/SITES/jQuery%20Mobile%20Form/index.html#tracks" url. I'm using FF but it happens in all browsers and it also happens when running on the test website.
The navigation works for the other two buttons on the page.
The behavior occurs regardless of what name I give the page.
I know I've seen this problem discussed but can't find the answer to it, so my apologies in advance it this is a duplicate or triplicate.
Can anyone point me in the right direction?
Updating to beta 2 of JQM took care of this problem. Don't know why but it is resolved now.
I have a search page that uses jQuery to populate a table with search results. Search.aspx is the main page and the data is added from SearchAdd.ascx.
I decided to recreate my project and so I manually copied everything from one project to the other. Everything works and looks the same in both projects except for this thing. When I've done a search, browsed to a search result and then hit the back button in the browser, I don't get the previous search results any more.
So my question is, what do I look for?
I've checked that these are exactly the same on both projects:
viestatemode="Enabled"
jQuery scripts
global.asax
web.config
What else is there to look for? Could have anything to do with the virtual directory?
Any help is appreciated.
browser back button has nothing to do with what you have tested for. it is simply client side. it shows the thing from the browser's history, unless you have not altered the behaviour of the back button.
It had to do with the jQuery version.
In my old project I used jquery-1.4.4.min.js and in the new I used jquery-1.5.1.min.js. Switched back and the history is kept when hitting the back button.
I don't know why though?