Friday, December 12th, 2008 | Author: MaX
Any Comments, bugs , feature request about Ajaxify v2.0, please post it here.
For advanced paid support or special requests. Contact me through the contact form.
Known issues:
- Stop ajaxify excuting based on onStart function return.
- Fix false warning “warning: target “#Ajaxifytemp” couldn`t be found”
- Fix back button on first ajaxify call.
Feature requests:
- Loading Images via ajaxify.
- Encode non safe characters in url’s before sending the request.
- Change the page title based on the loaded content.
For advanced paid support or special requests. Contact me through the contact form.
__________________________________________________________________________
How to make ajaxify compatible with jquery v1.3.0 and higher?.
- Open jquery.ajaxify.js with your preferred editor.
- Go to line 58. You will see var ver = jQuery.fn.jquery.split(‘.’);
- Mark it, and go down until you reach line 62. So the full text will be:
var ver = jQuery.fn.jquery.split('.'); if(ver[0] < 1 || ver[1] < 2 || ver[2] < 6){ jQuery.ajaxifylog('Error: Your jQuery version is old. Version 1.2.6 or newer is required.'); return false; } - Comment it or delete it. its your choice.
Category: jQuery
Loading ...
March 23rd, 2009 at 6:33 AM
I added the history fuctionality but it doesn’t see to work very effectively or as a user might expect.
Also, when paging there is an annoying horizontal “shake” effect as the browser vertical scroll bar disappears and then reapears. The effect happens when there is little vertical scroll on a page.
Again, demo at:
http://www.gooutdoors.com/Firearms/Images/1
Max, thanks for all your assistance and for a great plugin. Do you have something set up for donations?
March 24th, 2009 at 12:24 AM
Whats wrong?
You can avoid the shaking by setting a fixed height to the container through CSS. maybe something like min-height
Yes. You can find it at the top right corner in ajaxify’s home page.
March 26th, 2009 at 11:41 AM
Hi Max,
First off, thank you so much for your hardwork!
I’m having some issues with loading_txt and animations:
- I can’t get animations to work even though I’m following your animations code almost to the dot. Nothing shows up when I use this code:
$(‘#nav ul li a’)
.click(function(){
if(!$(this).hasClass(“current”)) {
$(“a.current”).removeClass(“current”);
$(this).addClass(“current”);
}
})
.ajaxify({
animateOut:{opacity:’0′},
animateOutSpeed:300,
animateIn:{opacity:’1′},
animateInSpeed:300,
loading_target:’#page-wrap’
});
If I change “loading_target” to “target”, there is no animation but instead the content is loaded *almost* immediately…which brings me to the second issue:
I can’t get rid of “Loading…” when the ajaxified link is clicked. Ideally I would either want no text or an image, but the text “Loading…” always shows no matter what I do.
I’m using Google Appengine to render my html sites; could that have anything to do with these problems?
March 27th, 2009 at 2:32 PM
Hey Max,
I posted this above a long time ago, January 9:
You replied:
I got busy at work and did not have the time to reply. For my use of Ajaxify (nationalcitypd.com), all other options are set in the .js file, like so:
// ajaxify with livequery $('.aj, .menu > ul > li > a, .menu > ul > li > ul > li > a, .menu > ul > li > ul > li > ul > li > a, #menu_container > ul > li > a, #menu_container > ul > li > ul > li > a, #menu_container > ul > li > ul > li > ul > li > a, #footerlist > li > a').livequery(function(){ $(this).ajaxify({ target: '#maincontent', animateOut:{opacity:'0'}, animateOutSpeed:300, animateIn:{opacity:'1'}, animateInSpeed:300, params:'c=1', onStart:function(){ scroll(0,0); }, loadHash:'attr:href', loading_img:'http://nationalcitypd.com/images/transparent.gif' }); });So all ajaxify is doing is, on chosen links, taking the link, adding the param, and loading the content in the div.
The problem that occurs is bookmarking. As I originally described, it’s possible to navigate to a page that the originally loaded page did not contain a link to. So the bookmark will not work. But, my hash is the URL itself, so even if a link to the bookmarked item doesn’t exist, Ajaxify could simply load the page directly!
For example, this bookmark will not work:
http://nationalcitypd.com/#http://nationalcitypd.com/photos/admin/
Because the index page does not contain a link to the page I eventually browsed to. However the whole URL is right there in the hash – ajaxify could request it any way.
So what I am requesting as an additional option, say “URLasHash:’true’”, that I could add to my .js to tell ajaxify to load the hash. This could solve the above bookmarking issue.
Does that make sense now?
I see my other two suggestions are listed above as feature requests:
Any idea when you may get to them? I know this is a free thing you do in your spare time. Many users of my site have told me they love the new “instant clicks” and my site gets tens of thousands of viewers a month – I’d love to be able to iron out these remaining issues.
Thanks for all your hard work MaX!
March 27th, 2009 at 6:22 PM
[...] Ajaxify – Support v2.0 [...]
March 27th, 2009 at 9:35 PM
Hey Max,
Still going strong i see
Quick onComplete question:
I am using onComplete to initialise a scroll function for the loaded content. The scroll function contains vars that tell the content to stop scrolling when it reaches the end (of the content). It seems these vars are not being “reset” on each load (though they are in the onComplete).
Example – 3 scrolling boxes as ajax content – 200px, 400px, 600px. If i load the 400px scrolling box first, then the 200px, it will continue to scroll as if it was 400px wide.
Scroller works fine non-ajax and also works fine on the first call.
Based on my amazing explanation … is there a way to “reset” the vars on each load?
Thanks Again!
Travis
March 29th, 2009 at 7:14 AM
#1 – Kudos for a wonderful plugin! You did a great job with it and I haven’t looked back once I stumbled over it. Thank you for your work, it is much appreciated.
#2 – possibly a bug, but I’m not really sure. Has anyone experienced issues about how IE displays data? This is not about the functionality or CSS – but the fonts (normal HTML text) appear jagged, as if you had a 2×2 px image and enlarged it to 400 pixels.
Do you know what I mean? I could post a screenshot if you are interested in this issue.
March 29th, 2009 at 4:05 PM
I’m not able to get the metadata.js plugin to change the title of my page… I used your example and nothing changes. IS there something missing?
March 29th, 2009 at 4:55 PM
I have ajaxify working for paging through datasets, as may be seen via link below:
http://www.gooutdoors.com/Firearms/Images/1
However, if I use a different URL to page through a subset of the data, the page produces an error of “object required” on the first line of my ajaxify script and it happens on the initial page load. Links do what they are intended to do but without an ajax response and the same error happens on every click. See example below:
http://www.gooutdoors.com/Firearms/Images/2/1
It might be my code but I tried a simple test page that does virtually nothing but place some text on the page and the same “object required” error happens on load. See below:
http://www.gooutdoors.com/Firearms/Images/Test/2/1
My ajaxify code is shown below and is in the header of my master page.
$('.ajaxify').livequery(function() { $(this).ajaxify({ target: '#AjaxContent', loading_img: '/SiteImages/ajax-loader1.gif', loading_target: '#AjaxContent', loadHash: 'attr:rel' }); window.scrollTo(0, 0); });March 29th, 2009 at 4:58 PM
No way to edit message but second link in my prior messages should be:
http://www.gooutdoors.com/firearms/Images/ListAlbum/2/1
March 29th, 2009 at 9:34 PM
Solved my object error. Seems I was loading the script files beginning with “../../scripts/etc”
Changing to “/scripts/etc” solved the problem. Apparently in some instances the location of ../../ was not recognized and jquery was never loaded.
March 29th, 2009 at 9:43 PM
OK. Now that it seems I’ve hopefully solved all my initial paging problems
, is there a way to update another segment of the page when making the ajax paging call?
I want a part of my master page containing a banner ad to update when the ajaxify call moves to the next page.
March 30th, 2009 at 6:48 PM
Isaac
Most probably your Internet connection is too fast. try to add some handler in your server side to delay the request.
You can make your own loading function by using loading_fn. Open ajaxify.js at line 26 you will see the default function. make a copy of it then edit what you need and implement it in loading_fn.
Cody
Glad to see you here again.
How could ajaxify recognize your target for example. I have discussed this before with Zachariah Kral. he has also suggested a solution by editing my source code for doing what you want. But I can’t really add this functionality to ajaxify because simply it will not fit for everybody. You can see the conversation here
And about the new version. I really can’t tell because I’m so busy these days.
Travis
Cant you add on onComplete fn var scroll = false; ? Can you post ur code if this not what you are looking for.
bobsoap
Thanks. the only thing that I can think of now is “IE IS A CRAAAP”. I haven’t face such a problem my self. but there is a lot of issues about IE rendering. its not just something that happens with ajaxify. as I remember it could be related to the windows clear type option. I would like to see you screenshots if you don’t mind.
Kenneth
How can I tell without a code.
JoeReynolds
Have you seen the multi tagToload option?
March 30th, 2009 at 6:55 PM
And BTW, Thank you JoeReynolds for your donation. I really appreciate it.
March 30th, 2009 at 7:51 PM
Max, I have looked at the multi tagtolaod function but cannot figure out how to use it. I have ajaxify working properly to refresh a div with an id of AjaxContent in my main content area.
I also have 2 other DIVs, named rightAd and topAd, in my masterpage. These contain Google ads. As you are probably aware the Google ads are javascript. I need to have these refresh when the AjaxContent DIV is refreshed.
My ajaxify script for the AjaxContent DIV is shown below. What do I need in this to make the Google ad DIVs to refresh as well?
$(document).ready(function() { $('.ajaxify').livequery(function() { $(this).ajaxify({ target: '#AjaxContent', loading_img: '/SiteImages/ajax-loader1.gif', loading_target: '#AjaxContent', loadHash: 'attr:rel' }); window.scrollTo(0, 0); }); });March 30th, 2009 at 9:03 PM
Prepare yor server output to something similar to this:
And change your ajaxify call to this:
$(document).ready(function() { $('.ajaxify').livequery(function() { $(this).ajaxify({ loading_img: '/SiteImages/ajax-loader1.gif', loading_target: '#AjaxContent', loadHash: 'attr:rel', tagToload:{ '#Pagination':'#AjaxContent', '#rightAdCode':'#rightAd', '#topAdCode':'#topAd'} }); window.scrollTo(0, 0); }); });March 30th, 2009 at 9:12 PM
Corrected the code above
March 31st, 2009 at 2:45 AM
Hey Max,
Yeah, what Zachariah discussed is the same issue – of “multi level” links. For those of us using only one target, ajaxify can simply use the target chosen in the options.
This is the single biggest issue for me because bookmarks do not work in this case. I tried using the code Zachariah posted, but it did not work at all for me (and yes I fixed the ampersands). I guess I’ll post over there and see if he has an idea why. My use case is the exact same as his (using href as hash with only one target).
I know it can be hard to work on free software like this. No sweat on the update, we all appreciate the work you do
This thread is quite monolithic – perhaps a forum would be better suited for the discussion here?
March 31st, 2009 at 3:44 AM
Max, I believe I followed your message post about tagToLoad to the letter. However, after initial pageload the first click on an ajaxified link produces the loading gif, but no content.
I think it may have to do with my DIV setup, but not sure.
I took your instructions about DIV and my code is as follows:
Here’s my DIV setup for the right ad code:
Is there other javascript required that is not shown in your message to me? I’ve been studying your demos but can’t get this to work.
Here’s the code I’m using to test changing Pagination and rightAdCode:
$(document).ready(function() { $('.ajaxify').livequery(function() { $(this).ajaxify({ loading_img: '/SiteImages/ajax-loader1.gif', loading_target: '#AjaxContent', loadHash: 'attr:rel', tagToload:{ '#Pagination':'#AjaxContent', '#rightAdCode':'#rightAd' } }); window.scrollTo(0, 0); }); });March 31st, 2009 at 4:19 AM
More info on my tagToload problem:
I added the ajaxify debug line and I see the following error alert:
Warning: Tag “#Pagination” couldn’t be found.
However I do have a div with id of Pagination on the page, per your instructions …. see my prior post. This explains the blank page on an ajaxify link, so now the question is … why doesn’t the code find the Pagination div?