Ajaxify – An Ajax Plugin
For web developers
- Interface
- Events
- Demo sites
- Installation
- Alwayshints
- Inline scripts
- Ajaxify forms
- Delta-Loading
- Memory effect
- Prefetch effect
- Scroll effects
- Preview effect
- Adsense + Ajaxify
- Logging
Optional visual effects
For geeks
Comments
We need your comments and feedback!! Please drop one here (see below) or in the respective sections
On which browsers does this work?
This plugin works on HTML5 browsers and gracefully degrades, if the HTML5 History API is not available.
href=”about.html” its a anchor tag so when i click on about link then about.html file open but i want to load this page on same page without reloading the page so:-
let ajaxify = new Ajaxify();
what is this function do? how does it detect i clicked on about.html anchor tag. I am getting any point about this let ajaxify = new Ajaxify(); objects? what i have to do next after initialize :-
this let ajaxify = new Ajaxify(); Object?
hi sir please help i have been using this plugin but i always get error
:- ajaxify.min.js:1 Uncaught TypeError: Cannot read properties of null (reading ‘attributes’) I got this error, i am using latest version of ajaxify and jquery.
1: this documentation is no really good for beginner’s, no any example how to setup proper and load page when click on menu or link
2: i am using this cdn : https://cdn.jsdelivr.net/gh/arvgta/ajaxify@8.2.9/ajaxify.min.js
and for jquery : https://code.jquery.com/jquery-3.7.0.min.js.. still getting error
3: home
when i click on home link then get error
4: let ajaxify = new Ajaxify()
please help sir i am using this plugin in small php project. i want to use it as a SPA application when page load without reloading
Hi there,
could you please check in a first step, whether older versions of Ajaxify don’t work either?
Thanks and regards,
Arvind
hello sir,
I did not get any help from your first step. I just set
and then
let ajaxify = new Ajaxify();
now how does it work for menu links, I mean when ever I would click on any menu link then how does load content without reloading page.
this documentation really scared and there is no any scene how to configure and implement ajaxify methods.
Hi there,
unfortunately, I don’t know much about CodeIgniter.
However, your question reminds me of this very positive comment.
But it sounds, like this guy is using Ajaxify instead of CodeIgniter…
Your Ajaxify call is alright:
let ajaxify = new Ajaxify();It initiates a full body swap, which should include your menu links…
Regards, Arvind
thanks for reply sir.
Sir I am asking about how does it work? there is no any single tutorial about how to use it.. ok so
let ajaxify = new Ajaxify();
initialize this method right now what i have to do next? how to does work navigation links, if i click on any link then the link(anchor tag) move to next page? so what is the advantage of using this plugin? please answer me in some detail and not given any this site reference.. so please give me some code where i get some points how does flow work.
thank you sir
lab
about
let ajaxify = new Ajaxify();
now tell me, is it right or wrong?
Already told you – it’s alright and invokes a full body swap
Hello Sir,
thanks for this very nice stuff.
I use Codeigniter for a while and every google request on how to ajaxify codeigniter is very specific or contains libraries, third-party installations and stuff like that.
Your tool is only two lines of code and everything works. 😀 😀
Thank you soooo much.
By the way… greetings from Munich! 🙂
I live also there.
bro can you tell me how did you configure this plugin in codeignter. please if possible create video tutorial about codeigniter with ajaxify plugin how does configure and implement.
please bro share me your JS code how did you configure ajaxify with codeignter
I would just like to know where can I find the plugin, I got the code but still, I’ve gone through the whole site, please tell me. I’m not a developer but I would appreciate some help.
Please have a look at:
– https://4nf.org/installation/
Hi,
Thanks for creating this library.
Where do I have to put the scripts:
in the header ? or just before ?
Do I have to use jQuery(‘#content, #nav’).ajaxify();
or let ajaxify = new Ajaxify({elements: ‘#content’});
Thanks
Hi Lorenzo,
yes, you include the plugin by placing one of these as described on the installation page in the head.
Then, you place the following:
let ajaxify = new Ajaxify({elements: ‘#content’});…in an inline script in the body or an existing one, but after including the plugin.
Thanks and regards,
Arvind
Great respect for your work. It’s unbelievable that you provide this for free. I just finished testing your plugin. Works perfectly for my purposes. Hats off. Thanks a lot.
Hi, this plugin looks clean and well organized, but I still dont get how to use it correctly. Is it also meant for bigger Webprojects? Websites that include a lot of server based code, databases and many more plugins. Or is the Idea of it, to “ajaxy” little Websites that already exist?
Hi, a high-level question for a change – thanks for that!
I would like to answer with a clear “yes”. The aim of this Ajaxify plugin is to address as many types of sites as possible, also highly complex ones and written with various types of CMS’s.
Here is the most prominent example site – Beinsports, that uses Ajaxify.
(Just verified, that they are still using Ajaxify – search for “ajaxify” in that file)
Also, 4nf.org itself uses WordPress as a CMS and employs several WP-plugins for syntax-highlighting, emojis, share buttons etc.
(Using WP obviously entails having an underlying database)
Finally, you can also see other examples with varying complexity in the demos section – quite a few examples that use Bootstrap as a CMS)
Which CMS do you aim to use? (I would say, that using a CMS is probably benificial when using Ajaxify)
Ajaxify just basically works on the HTML your site renders (including as many features of HTML5 as possible).
In this sense, it is not biased to any CMS / other tools or type of database.
Answering the other question, Ajaxify should obviously be capable of being used on existing and new sites.
However, you might need to customise your Ajaxify call a bit, as you say, for special or more complex features…
Feel free to ask more in-depth, if you need more assistance…
Thanks!
Hi, thank you for replying and for these few examples. But theres one thing – I dont use any cms. But I guess that is no problem. I just have to understand how the structure of my project has to be, to work properly with ajaxify.
Or do you think its a bad or “uncomfortable” idea to use ajaxify without a cms?
Hi Kev,
of course it is not mandatory to use a CMS. One advantage of a CMS is consistency across all pages of the site and the encapsulation of lower-level tasks.
Go for it!
Cheers, Arvind
Hi Kev,
because you were asking about more complex sites – here are two more:
(can also be seen towards the bottom of the demos page)
I believe at least one of them, if not both also use WooCommerce.
The creator of these sites – Matt Down – affirmed, that Ajaxify from 4nf.org was the first plugin to cooperate well with WooCommerce…
Hello there!
This plugin is simply amazing! Congratulations!
I was wondering if it is possible to call the clicked link with the method POST instead of GET, and also if it would be possible to send a parameter within. I’m not sending a form, it is just a flag so my controller can request the right page in php.
Thank you in advance for any light on that 🙂
Hi there! Glad you like it!
Interesting question. There is the possibility to toggle the mode GET/POST like this:
$.rq("is", true); //set mode to POST…in case you can do that before firing the Ajax request…
Do you have an idea how it might work yourself?
Thanks once more for the very positive posting…
… and the request data can be set programmatically, too, with:
$.rq("d", mydata);Hi, how do I add this to my theme? Do I just add the js code and call it in via functions, and then I’m done? Or do I have to do extras to it?
Exactly – you include the ajaxify.min.js in your theme.
The only other thing to do is to specify your Ajaxify interface…