You are here: Foswiki>System Web>JQueryPlugin>JQueryLoader (2024-12-23, UnknownUser)Edit Attach

JQueryLoader

Homepage: http://foswiki.org/Extensions/JQueryPlugin
Author(s): Michael Daum
Version: 4.80

This plugin allows to reload parts of a page, either automatically or manually.

On this page:

Usage
Examples

Usage

Add the %JQREQUIRE{"loader"}% macro to the page that you want to use this module on. Then add the jqLoader css class to the div element which will serve as a container for the content to be loaded. Any jqLoader container requires either an url or a section parameter to specify the location from where to load the content.

Parameter are specified using HTML5 data, as in

<div class="jqLoader" data-key1="value1" data-key2="value2" ...></div>

Parameter	Description	Default
url	the full url from where the content, e.g. `url:'https://outzenj.com/bin/view/MyWeb/MyTopic`	`%SCRIPTURLPATH{"view"}/<web>/<topic>`
web	the web from where to load content	current web
topic	the topic from where to load content	current topic
section	the section within the topic (see VarSTARTSECTION)
caching	boolean if disabled will prevent browser caching	true
select	jQuery selector to extract a specific node from the retrieved data
params	url parameter that are sent to the server	`{"skin":"text"}`
mode	specify whether the content is either loaded automatically or by clicking on the container; possible values: `auto`, `manual`	`manual`
reload-after	reload the content after the given milliseconds	0
show-effect	the effect used when showing the loaded content; possible values are listed in JQueryAnimate	`fadeIn`
hide-effect	the effect when hiding the loaded content; possible values are listed in JQueryAnimate	`fadeOut`
delay	additional time in miliseconds to delay fetching the content from the content; specifying `0` means load the content immediately; any other value will wait that time until issuing the request	0
onload	a JavaScript function called when the content has been loaded
beforeload	a JavaScript function called before the content is requested
finished	a JavaScript function called when the content has been loaded and displayed on the page

The jqLoader element is able to receive JavaScript events and process them accordingly. Similarly these events can be used to hook your own callbacks to be processed when they are fired.

Event	Description
refresh.jqloader	when triggered will reload the content from the backend
beforeload.jqloader	is triggered before requesting the content from the backend (see `beforeload` parameter above)
afterload.jqloader	is triggered when the content has been successfully been loaded (see `onload` parameter above)
finished.jqloader	is triggered when content has been loaded and finally been displayed on the page (see `finished` parameter above)

Examples

%JQREQUIRE{"loader"}%
<div class="jqLoader" data-section="recentchanges" id="myLoader">
%STARTSECTION{"recentchanges"}%%SEARCH{
    "'1'" 
    web="%BASEWEB%" 
    type="query" 
    nonoise="on" 
    order="modified" 
    reverse="on"
    limit="10"
    format="<p class='foswikiSearchResult'>[[$web.$topic]] $date - $rev - $wikiusername</p>"
}%%ENDSECTION{"recentchanges"}%
</div>

... if installed:

Effect:

Refresh

Topic revision: r1 - 2024-12-23, UnknownUser

System

Copyright © by the contributing authors. All material on this site is the property of the contributing authors.
Ideas, requests, problems regarding Foswiki? Send feedback