Why does bxslider not loading in the beginning but works when I refresh the page?
I already begin with $(document).ready(function(){});
I'm building it on Rails FYI.
https://photos4humanity.herokuapp.com/galleries
If you click on gallery, you will see a black page, then if you refresh it appears. Also it is not showing when I just click onto the link from the nav bar.
It should look like this
Ok, so after some troubleshooting, it's a rails specific situation. Turbolink that came with Rails prevented the site to reload. So download the jquery-turbolink gem will work.
JQuery gets loaded only on page refresh in Rails 4 application
Related
Below is the part of screenshot of mywebsite/index.php, a PC site with NO jQuery Mobile (JQM), with all scripts and styles.
Below the screenshot of mywebsite/mobile/options.php, a page designed to be run on mobile browsers, having JQM.
Here is the HTML script for Logout button, actually an ahchor tag:
Logout
.. refers to the main mywebsite folder out from mobile folder.
When I tap/click Logout, it should go to mywebsite/index.php, the PC site. And here's what shows up:
If I display the location using alert(document.location);, it shows - mywebsite/mobile/options.php.
I have to press F5 to view the page as it should.
I know that this is happening because JQM loads the pages AJAXually and hence ignores all scripts and stylesheets outside of BODY tag. I know this question is duplicate of many questions in StackOverflow and I have tried my level best to find a solution, but can't find one.
How do I move to the index.php without need to refresh?
You need to add additional code to your logout.php file to execute after the logout code executes. PHP headers can accomplish this. Within your PHP tags, add this to the end of your code:
header( 'Location: http://mywebsite/index.php' ) ;
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 have a web application that runs just fine on Android until I started to use jQM. It still runs fine with jQM on the desktop...
The problem is that when I load a "new URL" using "window.location.href = newLocation;" the new page loads fine the first time but the next time the page is displayed ok but then disappears and I can just see the header and footer of the first page (not the second). When I refresh I see the second page ok. Another way to have it working is to always refresh the first page b4 launching the second.
I have tried to disable page transition and Ajax but with no success.
If I run (I guess it is stupid):
$.mobile.changePage(newLocation, { transition: "none"});
window.location.href = newLocation;
it always works but then I sometimes get "Error loading page".
Any ideas? $.mobile.changePage(newLocation, { transition: "none"}); alone does not work...
Here is a "bypass" solution. It works but there may be better ones...
First I tried to add some JS to force a reload of the first page when coming back from the second but no JS executed...
Then I saw After travelling back in Firefox history, JavaScript won't run and just added "window.onunload = function(){};" to the first page. This prevents caching of the first page and now things are working.
It looks like page caching was causing the problem but I don't know why this means that jQM fails...
I created a web app (without browser chrome) which loads most of its pages locally from index.html. Now I have one page which i can not integrate into index.html, since it has to be refreshed when loaded. I placed it on the same server and called it stats.html and link to it like this:
Stats
When I click this link, the browser pops to the front instead switching to the page without browser chrome.
How can I link to an external page in a way that it still looks like one app?
I appreciate any hints to solve this problem.
just found https://github.com/mrmoses/jQuery.stayInWebApp that seems to be the solution.
I have a web application made with jQuery Mobile beta 2. The start page of the application has the URL http://server/mob/start.php and its page div has ID 'frontpage' and data-url is also 'frontpage'.
When I click a link from the start page and from the just opened page click Home button which points back to URL /mob/start.php, I end up with two frontpage divs in my DOM. The newly added frontpage has the same ID but its data-url is '/mob/start.php/'.
I could of course remove the page divs where I'm navigating away from but after the above described navigation the browser is pointed at URL /mob/start.php#/mob/start.php. Thus when I reload the page, I end up with same situation again.
What am I doing wrong because this problem doesn't seem to appear in jQueryMobile.com site?
UPDATE: Each page is an independent page and contains only one page div so links are not made by ID but by local relative URL.
I updated jQuery Mobile to beta 3 and can no longer reproduce the problem.