I using Opencart CMS. I was apply Opencart version Mobile by using Jquery mobile.
All page working very well but Checkout page.
Jquery mobile working for the first load and no Modify. But when i choose "Modify" button and Submit it. The next page (Load via Ajax) will don't apply css and js.
I have tried using .page() , .trigger(create) methods ... and got nowhere.
Please help me!
I have the same problem with a multi-page template.
When I call $.mobile.changePage() the page loads just fine at first. On the second call the CSS is not loaded (or painted properly).
Related
I'm developping a jqm application with spring mobile in the back-end.
Whenever I hit the browser refresh button on my mobile phone the page is completely devastated afterwards. Browsers back-button works properly.
The data are still available due prg pattern (flashAttributes in Spring) after refresh. Only the view is malformed.
Any ideas how to solve this problem?
From jQuery Mobile docs :
The simplest approach when building a jQuery Mobile site is to reference the same set of stylesheets and scripts in the head of every page. If you need to load in specific scripts or styles for a particular page, we recommend binding logic to the pageinit event (details below) to run necessary code when a specific page is created (which can be determined by its id attribute, or a number of other ways). Following this approach will ensure that the code executes if the page is loaded directly or is pulled in and shown via Ajax
So what happens is - in jQuery Mobile, the scripts and styles defined in the head are loaded only once. So, in normal conditions, it works fine, as all the pages will use the scripts loaded from the first page.
But. When you refresh a page in-between, it triggers a page-reload instead of the ajax navigation model thatjqm uses. So all the scripts and styles loaded from the first page will not be included from here on out.
What you need to do is "reference the same set of stylesheets and scripts in the head of every page", so that even if you hit refresh in the middle, the scripts and styles that had been loaded from the head of the first page are loaded again.
I recommend you read the docs from the above link fully to gain a better understanding.
I have a website where I am switching from addThis to addToAny for social sharing buttons. The problem is that the share buttons are contained in content that is loaded dynamically with jquery Waypoints infinite scroll feature (which uses Ajax). When the page first loads (so no Ajax called yet) everything works great, but when a user scrolls and more content is added that contain the share buttons, the new buttons don't work in that they don't show the share options on hover or click.
There are supposedly fixes for this if using templates from the likes of Drupal or Wordpress, but my site is not built using any of these templates. This was also a known issue with addThis, and to get around the problem you simply need to add 'addthis.toolbox('.addthis_toolbox')' into the success portion of the ajax call and things would work.
I haven't had any success getting addToAny to work after ajax returns. They have something that looked promising: a2a.init('page'), but that doesn't work. Has anyone had this problem and have any suggestions on how to fix it? Thanks!
If there so many share button on one page you can call this after ajax success:
$(".a2a_dd").each(function() {
a2a.init('page');
});
Or if there only one share button, you can use this after ajax success:
a2a.init('page');
If want to know more details go through this document
According to the AddToAny API (https://www.addtoany.com/buttons/api/), you should use a2a.init_all(); if you are loading a number of new share button sets at once via AJAX.
Using a2a.init('page'); only initializes the last uninitialized buttons instance on the page. That might be fine for you, depending on how many new buttons that you load at a time.
Example: you have a blog site that loads new posts when the user scrolls to the end of the page. If you are only loading one new set of share buttons for the new content, a2a.init('page'); should work. If instead, you are loading a few new posts at a time, that each get their own set of share buttons, you will want to use a2a.init_all();
Hope this helps someone!
Here's my issue, I'm trying to load a FB comments module via an AJAX div. Now, it works if I go directly to the php page, but if I load it from within the div, it doesn't. I've looked at the other posts (FB javascript SDK after jquery LOAD (ajax)), but still can't seem to get it to work, looking for clarification.
If you want to see what I'm talking about, check http://azconceptphoto.com/lindsey and check out testimonials.
Ideally, on the normal part of my site, I can just load the HTML5 code and it works fine, though for some reason it doesn't remotely work via the AJAX div. And considering the posts from before are out of date (2011), I was hoping to get more feedback on this.
Based on the code from your link you are not using any of the PrototypeJS Ajax methods to get the backend script. Ajax.Updater is the method you need to use so....
Here is my suggestion
change the definition of loadXMLDoc() to
function loadXMLDoc(div, location)
{
new Ajax.Updater(div,location,{'evalScripts':true});
}
this will update the contents of div with the contents of location. Also if the response has <script> tags in it then the javascript will be parsed and evaluated (thats the option evalScripts)
I have a calendar http://tinyurl.com/bn9r6lk . (plugin: http://tinyurl.com/7axlse4)
the content loads through Lightbox Plus wp plugin.
Can't get the lightbox to work after any switching of the month. Even when I change back to the initial month.
Help is much appreciated.
I don't have any experience with Lightbox but for other plugins I am using a reload function after each Ajax request. Please, check jQuery.getScript.
$.getScript("plugins/lightbox.js");
Hi Masters Of Web Development.
I have a not that simple question this time. I have got a simple external HTML page, that I want to include in my site. The HTML page contains a submit form or something like that, and I wish to send this data from the form, without to reload the whole page. So I decided to put HTML page inside iframe. But, some people said that this is older technology, google doesn't like iframes, etc. So I want to use something like AJAX or JQuery to load that external HTML page, and to send submit form without reloading the whole page with it. :)
Any suggestions on how to make this?
Thanks in advance :)
Do you really need Google to index that iframe form? If that's the only iframe you have throughout the site, it aint going to be a problem in terms of google indexing.
About using the Iframe, if you are not comfortable learning and building ajax-type form, you'll still be fine (like what Frankie commented). Just make sure the form works, usable and compatible with popular browsers.
You want to use the jQuery Forms Plugin. Its very straightforward and easy to turn any normal HTML form into an AJAX form.