[FX.php List] Multiple AJAX with 1 JavaScript function?

Joel Shapiro jsfmp at earthlink.net
Wed May 23 12:54:37 MDT 2007


Thanks so much for the reply, Kevin.  I'll try this out and report back.

And ajaxload.info is great.  (I've already got a couple loading.gifs,  
although in this current project the speed is (so far) so fast that  
you barely see anything but the returned results :)

Best,
-Joel


On May 23, 2007, at 11:34 AM, Kevin Becker wrote:

> Hi Joel,
>
> I recently started using LAJAX and Lance Hallberg was very generous  
> with
> helping me out with this same problem.  I am NOT much of a JavaScript
> user, so forgive my ignorance when I try to describe what little I  
> do know.
>
> One thing he wrote was, "First, to be sure, LAJAX is self  
> instantiating so
> you do not want to
> create multiple instances of it."  So you only need to define the  
> function
> once at the top of the page (or call the LAJAX.js file).
>
> 	<script language="JavaScript" src="LAJAX.js"></script>
>
>
> He gave me some tips and this is what I came up with which works for
> multiple LAJAX instances on one page.
>
> I place this in the <head>:
>
> 	<script type='text/javascript'>
> 		var url='process_some_data.php';
> 		var url2='process_some_other_data.php';
> 		var divID=null;
>
> 		// my 1st handler
> 		function updatePost()
> 		{
> 			if(LAJAX.state() == 4) {
> 	 			document.getElementById(divID).innerHTML=LAJAX.result();
> 	 		} else {
> 				document.getElementById(divID).innerHTML="<img src='loading.gif'
> />Loading... ";
> 	 		}
> 		}
> 		
>
> 		
> 		// my 2nd handler
> 		function updateGet()
> 		{
> 			if(LAJAX.state() == 4) {
> 	 			document.getElementById(divID).innerHTML=LAJAX.result();
> 	 		} else {
> 				document.getElementById(divID).innerHTML="<img src='loading.gif'
> />Loading... ";
> 	 		}
> 		}
> 	</script>
>
> You can assign several url variables (url, url2, url3...) if you  
> have more
> than one area on the page that needs to use LAJAX to process different
> types of data.  The divID=null establishes divID as a global variable
> within JavaScript.  Notice that you must also edit the updatePost()  
> and
> updateGet() functions to use divID instead of 'postDIV' and  
> 'getDIV' in
> the original LAJAX script.  I also added an animated 'loading.gif' to
> spice things up.  visit http://ajaxload.info/
>
> Then within the body you'll use PHP to give each returned FM record a
> unique <div id='...'> and <form name='...'> so LAJAX can update or  
> reload
> specific records within their own div:
>
> 	<div id='record<?php echo $recordID; ?>'>
>
> 	<form name="form<?php echo $recordID; ?>" id="form<?php echo  
> $pid; ?>">
> 		<input type="hidden" id="recordID" name="recordID" value="<?php echo
> $recordID; ?>"/>
> 		<input type="hidden" id="moredata" name="moredata" value="1"/>
> 	</form>
>
> 	<a href="javascript:divID='record<?php echo $recordID; ?>';
> LAJAX.post(url,updatePost,
> 	'recordID='+document.form<?php echo $recordID; ?>['recordID'].value+
> 	'&moredata='+document.form<?php echo $recordID;
> ?>['moredata'].value);">EDIT</a>
>
> 	</div>
>
>
> I hope this points you in the right direction, and I hope my  
> explanation
> makes sense.
>
> Kevin Becker
>
> On Tuesday, May 22, 2007 at 10:09 PM -0500 Joel wrote:
>> Message: 3
>> Date: Tue, 22 May 2007 17:28:10 -0700
>> From: Joel Shapiro <jsfmp at earthlink.net>
>> Subject: [FX.php List] Multiple AJAX with 1 JavaScript function?
>> To: "FX.php Discussion List" <fx.php_list at mail.iviking.org>
>> Message-ID: <E0A31D73-A762-4FA9-A71E-110DC42C6A80 at earthlink.net>
>> Content-Type: text/plain; charset=US-ASCII; delsp=yes; format=flowed
>>
>> Hi all
>>
>> I'm pulling a list of course-offering titles via FX.  For each
>> returned title, I want to have an AJAX (LAJAX) link to "Check for
>> upcoming classes".  I'm currently having the php generate one
>> 'serialized' JavaScript function for each returned course-offering
>> (which works fine), but I'm wondering if there's a way to have just
>> one JavaScript function and somehow use unique parameters for each
>> result and respective DIV.
>>
>> Here's what my generated code looks like:
>> ---------------------------------------------
>> function FindUpcoming0() {
>> 	if(LAJAX.state() == 4) {
>> 			document.getElementById('getDIV0').innerHTML=LAJAX.result();
>> 		} else {
>> 			document.getElementById('getDIV0').innerHTML="Fetching data ... "
>> + LAJAX.state();
>> 		}
>> }
>>
>> function FindUpcoming1() {
>> 	if(LAJAX.state() == 4) {
>> 			document.getElementById('getDIV1').innerHTML=LAJAX.result();
>> 		} else {
>> 			document.getElementById('getDIV1').innerHTML="Fetching data ... "
>> + LAJAX.state();
>> 		}
>> }
>>
>> // ETC...
>> ---------------------------------------------
>>
>> The generated links are:
>> <a href="javascript:LAJAX.get(url,FindUpcoming0,'id=123');">
>> <a href="javascript:LAJAX.get(url,FindUpcoming1,'id=456');">
>> etc...
>>
>> I'm looking for some kind of generic FindUpcoming() function that I
>> could pass a '13' to, so that the results would display in DIV13.
>> I've tried a few ways but couldn't get anything to work.  Is this
>> possible, or do I really need a unique js function for each call?
>>
>> TIA,
>> -Joel
>
> _______________________________________________
> FX.php_List mailing list
> FX.php_List at mail.iviking.org
> http://www.iviking.org/mailman/listinfo/fx.php_list



More information about the FX.php_List mailing list