J1.5:Ajax client code using MooTools - Revision history

Tom Hutchison: added Category:Archived version Joomla! 1.5 using HotCat

2013-05-27T22:39:30Z

added Category:Archived version Joomla! 1.5 using HotCat

← Older revision		Revision as of 22:39, 27 May 2013
Line 108:		Line 108:
	Notice that in this example there is also some code to add, and subsequently remove, an <tt>ajax-loading</tt> CSS class from the <tt>ajax-container</tt> element. Typically, the presence of this class will cause a "spinner" graphic element to be loaded as a background image to make the user aware that the system is still alive.		Notice that in this example there is also some code to add, and subsequently remove, an <tt>ajax-loading</tt> CSS class from the <tt>ajax-container</tt> element. Typically, the presence of this class will cause a "spinner" graphic element to be loaded as a background image to make the user aware that the system is still alive.
	<noinclude> </noinclude>		<noinclude> </noinclude>

			[[Category:Archived version Joomla! 1.5]]

Tom Hutchison: removed Category:Development using HotCat

2013-05-27T22:39:21Z

removed Category:Development using HotCat

← Older revision		Revision as of 22:39, 27 May 2013
Line 107:		Line 107:
	</source>		</source>
	Notice that in this example there is also some code to add, and subsequently remove, an <tt>ajax-loading</tt> CSS class from the <tt>ajax-container</tt> element. Typically, the presence of this class will cause a "spinner" graphic element to be loaded as a background image to make the user aware that the system is still alive.		Notice that in this example there is also some code to add, and subsequently remove, an <tt>ajax-loading</tt> CSS class from the <tt>ajax-container</tt> element. Typically, the presence of this class will cause a "spinner" graphic element to be loaded as a background image to make the user aware that the system is still alive.
	<noinclude>~~[[Category:Development]]~~ </noinclude>		<noinclude> </noinclude>

Tom Hutchison: removed Category:Topics using HotCat

2013-05-27T22:39:16Z

removed Category:Topics using HotCat

← Older revision		Revision as of 22:39, 27 May 2013
Line 107:		Line 107:
	</source>		</source>
	Notice that in this example there is also some code to add, and subsequently remove, an <tt>ajax-loading</tt> CSS class from the <tt>ajax-container</tt> element. Typically, the presence of this class will cause a "spinner" graphic element to be loaded as a background image to make the user aware that the system is still alive.		Notice that in this example there is also some code to add, and subsequently remove, an <tt>ajax-loading</tt> CSS class from the <tt>ajax-container</tt> element. Typically, the presence of this class will cause a "spinner" graphic element to be loaded as a background image to make the user aware that the system is still alive.
	<noinclude>[[Category:Development~~]][[Category:Topics~~]]</noinclude>		<noinclude>[[Category:Development]] </noinclude>

Tom Hutchison: Hutchy68 moved page Ajax client code using MooTools to J1.5:Ajax client code using MooTools: archiving with namespacing

2013-05-27T22:39:10Z

Hutchy68 moved page Ajax client code using MooTools to J1.5:Ajax client code using MooTools: archiving with namespacing

← Older revision	Revision as of 22:39, 27 May 2013
(No difference)

Wilsonge: Move noinclude tags

2013-04-22T12:53:13Z

Move noinclude tags

← Older revision		Revision as of 12:53, 22 April 2013
Line 1:		Line 1:
	{{version\|1.5}}		<noinclude>{{version\|1.5}}
	~~<noinclude>~~{{notice\|This article applies to Joomla! 1.5 only as Joomla! 1.6 ships with a later version of MooTools which has a different way		{{notice\|This article applies to Joomla! 1.5 only as Joomla! 1.6 ships with a later version of MooTools which has a different way
	of handling Ajax requests.}}</noinclude>		of handling Ajax requests.}}</noinclude>

Wilsonge: Add version tag and make the notice a no-include

2013-04-22T12:52:17Z

Add version tag and make the notice a no-include

← Older revision		Revision as of 12:52, 22 April 2013
Line 1:		Line 1:
	{{notice\|This article applies to Joomla! 1.5 only as Joomla! 1.6 ships with a later version of MooTools which has a different way		{{version\|1.5}}
	of handling Ajax requests.}}		<noinclude>{{notice\|This article applies to Joomla! 1.5 only as Joomla! 1.6 ships with a later version of MooTools which has a different way
			of handling Ajax requests.}}</noinclude>

	In a typical Ajax application you will want to pull some data from a server, which could be your own Joomla site or a remote web service, and update some element on the web page with the data returned by the server. There are three elements to a typical Ajax implementation:		In a typical Ajax application you will want to pull some data from a server, which could be your own Joomla site or a remote web service, and update some element on the web page with the data returned by the server. There are three elements to a typical Ajax implementation:

Nicholasjohn16 at 23:43, 5 November 2011

2011-11-05T23:43:30Z

← Older revision		Revision as of 23:43, 5 November 2011
Line 87:		Line 87:
	The following is a more complete example of an Ajax function which receives data from the server in JSON format, decodes it, then pushes data from the response into <tt>ajax-container</tt>.		The following is a more complete example of an Ajax function which receives data from the server in JSON format, decodes it, then pushes data from the response into <tt>ajax-container</tt>.
	<source lang="javascript">		<source lang="javascript">
	window.addEvent( 'domready', function() {		window.addEvent('domready',function() {

	$('drop-down').addEvent( 'change', function() {		$('drop-down').addEvent('change',function(){

	$('ajax-container').empty().addClass('ajax-loading');		$('ajax-container').empty().addClass('ajax-loading');

	var a = new Ajax( {$url}, {		var a = new Ajax({$url},{
	method: 'get',		method:'get',
	onComplete: function( response ) {		onComplete:function(response){
	var resp = Json.evaluate( response );		var resp=Json.evaluate(response);

	// Other code to execute when the request completes.		// Other code to execute when the request completes.
			$('ajax-container').removeClass('ajax-loading').setHTML(output);
	$('ajax-container').removeClass('ajax-loading').setHTML( output );		}
			}).request();
	}		});
	}).request();
	});
	});		});
	</source>		</source>
	Notice that in this example there is also some code to add, and subsequently remove, an <tt>ajax-loading</tt> CSS class from the <tt>ajax-container</tt> element. Typically, the presence of this class will cause a "spinner" graphic element to be loaded as a background image to make the user aware that the system is still alive.		Notice that in this example there is also some code to add, and subsequently remove, an <tt>ajax-loading</tt> CSS class from the <tt>ajax-container</tt> element. Typically, the presence of this class will cause a "spinner" graphic element to be loaded as a background image to make the user aware that the system is still alive.
	<noinclude>[[Category:Development]][[Category:Topics]]</noinclude>		<noinclude>[[Category:Development]][[Category:Topics]]</noinclude>

Realityking at 22:48, 17 June 2011

2011-06-17T22:48:32Z

← Older revision		Revision as of 22:48, 17 June 2011
Line 1:		Line 1:
	{~~JVer~~\|1.5}}		{{notice\|This article applies to Joomla! 1.5 only as Joomla! 1.6 ships with a later version of MooTools which has a different way
			of handling Ajax requests.}}

	In a typical Ajax application you will want to pull some data from a server, which could be your own Joomla site or a remote web service, and update some element on the web page with the data returned by the server. There are three elements to a typical Ajax implementation:		In a typical Ajax application you will want to pull some data from a server, which could be your own Joomla site or a remote web service, and update some element on the web page with the data returned by the server. There are three elements to a typical Ajax implementation:

Realityking at 22:47, 17 June 2011

2011-06-17T22:47:50Z

← Older revision		Revision as of 22:47, 17 June 2011
Line 1:		Line 1:
			{JVer\|1.5}}

	In a typical Ajax application you will want to pull some data from a server, which could be your own Joomla site or a remote web service, and update some element on the web page with the data returned by the server. There are three elements to a typical Ajax implementation:		In a typical Ajax application you will want to pull some data from a server, which could be your own Joomla site or a remote web service, and update some element on the web page with the data returned by the server. There are three elements to a typical Ajax implementation:
	* An HTML element whose change of state will trigger the Ajax request.		* An HTML element whose change of state will trigger the Ajax request.

Realityking: Undo revision 37653 by Chris Davenport (Talk) Changes are also true for Joomla 1.5

2011-03-01T11:15:16Z

Undo revision 37653 by Chris Davenport (Talk) Changes are also true for Joomla 1.5

← Older revision		Revision as of 11:15, 1 March 2011
Line 36:		Line 36:
	<?php		<?php
	$ajax = <<<EOD		$ajax = <<<EOD
	~~/* <![CDATA[ */~~
	Your JavaScript code goes here.		Your JavaScript code goes here.
	~~/* ]]> */~~
	EOD;		EOD;

Line 44:		Line 42:
	$doc->addScriptDeclaration( $ajax );		$doc->addScriptDeclaration( $ajax );
	</source>		</source>
	~~Wrapping the JavaScript code between <tt>/* <![CDATA[ /</tt> and <tt>/ ]]> */</tt> allows the JavaScript to be output without causing problems with HTML validators.~~

	You can embed PHP variables in the heredoc text by surrounding them with braces, like this:		You can embed PHP variables in the heredoc text by surrounding them with braces, like this:
Line 50:		Line 47:
	<?php		<?php
	$ajax = <<<EOD		$ajax = <<<EOD
	~~/* <![CDATA[ */~~
	This is some JavaScript code with {$this->embedded} PHP variable in it.		This is some JavaScript code with {$this->embedded} PHP variable in it.
	~~/* ]]> */~~
	EOD;		EOD;