View Full Version : Ajax Jquery combination

02-05-2010, 02:19 AM

i found this script over googling.

this is a very basic yet poweful thing.

it displays a html page on click and shows a loading image.
(this is all done using axax)

The problem is that this script only displays one html document and we are looking to display more.



coding as following

<script language="javascript">
function example_ajax_request() {
$('#example-placeholder').html('<p><img src="http://www.electrictoolbox.com/images/ajax-loader.gif" width="220" height="19" /></p>');
setTimeout('example_ajax_request_go()', 2000);
function example_ajax_request_go() {

<p><input type="button" value="Click Me!" onclick="example_ajax_request()" /></p>
<div id="example-placeholder">
<p>Placeholding text</p>

now the sample_tutorials.html is the file which is being displayed and what i need is to display more a new file on each click.


02-05-2010, 06:19 AM
<script type="text/javascript">
function example_ajax_request(page){
$('#example-placeholder').html('<p><img src="http://www.electrictoolbox.com/images/ajax-loader.gif" width="220" height="19" /></p>');
setTimeout(function(){example_ajax_request_go(page);}, 2000);
function example_ajax_request_go(page){
<p><input type="button" value="Tutorial" onclick="example_ajax_request('sample_tutorials.html');" /></p>
<p><input type="button" value="Something Else" onclick="example_ajax_request('some_other.html');" /></p>
<div id="example-placeholder">
<p>Placeholding text</p>

02-05-2010, 05:40 PM
A good menu for testing Ajax is the AnyLink Css Menu (http://www.dynamicdrive.com/dynamicindex1/anylinkcss.htm). Including this menu with the Ajax function given above does not give us what we want. The menu is there, but it does not function. So the Ajax/script is less powerful as you may think.

Arie Molendijk.