[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