[FX.php List] JavaScript, AJAX, jQuery assistance?

[Joel Shapiro]

OK.  I've *finally* got it.  HUGE THANKS to everyone who helped:  
Dale, Nick, Alex, Steve and Michael for all your great help!

It turns out that the jTip plugin was the cause of the stray partial  
tooltip that displayed below all other content in both Safari and IE 
(7) (when hovering over the original tooltip link after loading the  
AJAX div).  I've switched to clueTip (another jQuery plugin) and the  
Safari/IE problem is gone(!!)
(jTip & clueTip each have some features I like better than in the  
other, but I guess I can't have everything ;)

I've put up new demos here:
http://jsfmp.com/tooltips/jtip.html
http://jsfmp.com/tooltips/cluetip.html (I haven't reformatted this  
css yet)


Michael:
a) Thanks for showing me how to use jQuery's "load" function instead  
of LAJAX.  I still need to figure out how to include parameters in  
that (e.g. in my real project, each load is to a specific div), but  
I'll look into it.

b) FYI: JT_init(); doesn't actually need to get called on the main  
page since jtip.js starts with "$(document).ready(JT_init);" --  
although this is now a moot point for me since I'll be switching to  
clueTip

c) Thanks for attaching the AJAX-load div to a <p> element; it helps  
me understand jQuery a bit better.  For my project, I want to use a  
hover css formatting.  I'll be looking into jQuery again to see if I  
can do that with a <p> or if I'll go back to using <a>.

d) I'll be looking through your INT610 demo again, which seems like  
it might help me with my (a) & (c) above :)


Thanks again everyone.

-Joel


On Sep 28, 2007, at 5:10 PM, Michael Ward wrote:

> Hi Joel,
>
> On 28/09/2007, at 2:46 PM, Joel Shapiro wrote:
>
>> Hi Michael
>>
>> Thanks for the reply.  Unfortunately, neither of these options  
>> work satisfactorily:
>> Including JT_init(); as part of the LAJAX callback causes  
>> duplicate displays of the original tooltip (at least in Safari),  
>> and adding JavaScript to the called page (ajaxpage.html) doesn't  
>> actually fire off the JavaScript.
>>
>> Steve Winter thinks that it's the way that LAJAX writes content to  
>> the div that's the problem.  He recommends prototype, through  
>> which he says "you can explicitly allow or deny the running of  
>> scripts within loaded files during the call to that file".  I'll  
>> be giving that a try, as well as looking at how jQuery might do  
>> this.  (Do you know this already?  Is it easy to figure out?)
>
> Hmm... mixing different libraries is always a quandary.
>
> I have now had a look at your code and have made it all  
> "jQuerified" so it now works.
>
> I've actually done it two ways...
>
> 1)
>
> I removed references to Lajax and called JT_init on document load:
>
> $(function(){
> 		JT_init();
>     });
>
> this takes care of the first tootip on the original page.
>
> I then use the "load" jQuery function to load "ajaxpage.html" into  
> the "getDiv" div calling JT_init  as a callback:
>
> <a href="#" onClick="$('#getDIV').load('ajaxpage.html',function() 
> {JT_init();});"> link here</a>
>
> This now works fine in FireFox, although there appears to be an  
> artifact (the tooltip header) in safari.
>
> 2)
>
> I called both JT_init and "preloaded" the "load" event (attached to  
> a "p" tag) on document load:
>
> 	$(function(){
> 		JT_init();
> 		$('p.getDiv').click(function() {
> 		$('#getDIV').load('ajaxpage.html',function(){JT_init();})
>     });
> 	return false;
> }
> );
>
> Which basically says... when you click the "p" tag with a getDiv  
> class, do the jTip stuff.
>
> So when you click on the paragraph text, the div is loaded.  I  
> haven't done anything to alert the user that this paragraph is  
> "clickable"!
>
> The benefit of this way is that you can send different pages into  
> the load callback, (based on some criteria in the "p" tag)
>
> I briefly covered a way to do this in my DevCon presentation  
> (INT610) and the code can be found in folder "20".  You'll need to  
> digest "final.php" (the page that is called),  "pubs.php" ( a  
> loaded div) and "articles.php" (the different "tooltips" that are  
> called) to make sense of it.
>
> One last thing... If it were me, I'd be working in only one  
> Javascript library, unless you have been given code that works  
> solidly and you need to extend it.
>
> I don't know if this list supports attachments so have sent this  
> email back channel as well.  If anyone wasn't at DevCon and wants a  
> copy of the presentation files, please let me know.
>
> Regards
>
> Michael Ward
> --
> Head Honcho
> CustoMike Solutions
> Member, FileMaker Business Alliance
> Member, FileMaker Technical Network
> FileMaker 7 Certified Developer
> FileMaker 8 Certified Developer
> 10 Wandoo Crt
> Wheelers Hill, 3150
> ph 0414 562 501
> headhoncho at customikesolutions.com
>
> <Archive.zip>
>
> _______________________________________________
> FX.php_List mailing list
> FX.php_List at mail.iviking.org
> http://www.iviking.org/mailman/listinfo/fx.php_list