Ajax links API module help you to load any content to a specified DIV or ajaxify whole drupal site, using JQuery Ajax. This module will also load JS for Ajax-loaded content by using Drupal.attachBehaviors(). In case you dont want to load js or css, you can alter tpl for path/node type.
Links will work as normal if Javacript is disabled so no effect on web crawlers used by search engines.In HTML5 browsers, title bar and url will change using history.pushState(). Also, it will update active class on links.
Please note that this module wont ajaxify forms! To ajaxify forms ,you may use asaf module.
How to use Ajax links API :
METHOD 1 :
Example : Goto module config > jQuery selector : For example, you can ajaxify all links under #content
by specifying #content a
.In case you want to exclude a link with class .menu, you can use !.menu a
.Target DIV will be default target div defined. You can change the target DIV from module config page.
METHOD 2 :
7.x Example :
echo l_ajax("add page", "node/add/page", "#content"); // You can override default target DIV by passing third variable.If not, it will use default target DIV defined in module config page.
8.x Example :
$service = \Drupal::service('ajax_links_api.ajax_link');
$link = $service->lAjax("add page", "/node/add/page", "#content"); // You can override default target DIV by passing third variable.If not, it will use default target DIV defined in module config page.
METHOD 3 :
Example : Add class="ajax-link"
to any link. <a class="ajax-link" href="node/add/page" rel="#content">Add page</a>
You can override default target DIV by specifying rel=""
.
Override template :
7.x:
- Developer can add/remove any variables by copying html--ajax.tpl.php and page--ajax.tpl.php to their theme. All variables available to html.tpl.php/page.tpl.php can be used.
- In case you want to override page--ajax.tpl.php, for eg: for path
node/add
, you can create page--node--add--ajax.tpl.php. Same applicable for html--node--add--ajax.tpl.
8.x:
- Developer can add/remove any variables by copying html--ajax.html.twig and page--ajax.html.twig to their theme. All variables available to html.html.twig/page.html.twig can be used.
- In case you want to override page--ajax.html.twig, for eg: for path
/node/add
, you can create page--node--add--ajax.html.twig. Same applicable for html--node--add--ajax.html.twig.
Please read README.txt first ,for Drupal 6 only.
For more detailed instruction read doc.
Known Issues
- #1955516: back button browser / backspace does not reload previous content
- #1923320: Content not loading after first ajax call.
Please help me fix them if you can.
Pledges
- #D7AX - I pledge to make this module as accessible as it can be. If you find any flaws, please submit an issue. Help me fix them if you can.
Thanks to
Sun for basic idea and codes. fotisp, cityreader, Rob C, roshkovanv, agoradesign, rballou, olofjohansson and others for helping to resolve issues :)
Showcase
Check some sites which using ajax_links_api module. Add yours :)
Project information
- Module categories: Content Display, Developer Tools, Site Structure
- 589 sites report using this module
- Created by serjas on , updated
- Stable releases for this project are covered by the security advisory policy.
Look for the shield icon below.
Releases
Development version: 7.x-1.x-dev updated 15 Nov 2013 at 10:43 UTC