Canman2005 Posted September 10, 2009 Share Posted September 10, 2009 Hi all I have a tooltip script and I'm getting an error ajax_showTooltip is not defined though firebug. if I look at the scripts function, I get function onclick(event) { ajax_showTooltip("contentdeletebox.php?id=109", this); return false; } the HTML im using to kick off that javascipt function is <a onClick="ajaxLoader('content.php?edit=<?php print $row['id']; ?>','content');">click</a> It works fine locally on my computer, but when uploaded to its home server, the error appears and the tooltip is disabled with only that error to go on. any ideas anyone? thanks Quote Link to comment Share on other sites More sharing options...
RichardRotterdam Posted September 10, 2009 Share Posted September 10, 2009 What does you ajax_showTooltip function look like? Quote Link to comment Share on other sites More sharing options...
Canman2005 Posted September 10, 2009 Author Share Posted September 10, 2009 the code looks like var x_offset_tooltip = 5; var y_offset_tooltip = 0; var ajax_tooltipObj = false; var ajax_tooltipObj_iframe = false; var ajax_tooltip_MSIE = false; if(navigator.userAgent.indexOf('MSIE')>=0)ajax_tooltip_MSIE=true; function ajax_showTooltip(externalFile,inputObj) { if(!ajax_tooltipObj) /* Tooltip div not created yet ? */ { ajax_tooltipObj = document.createElement('DIV'); ajax_tooltipObj.style.position = 'absolute'; ajax_tooltipObj.id = 'ajax_tooltipObj'; document.body.appendChild(ajax_tooltipObj); var leftDiv = document.createElement('DIV'); /* Create arrow div */ leftDiv.className='ajax_tooltip_arrow'; leftDiv.id = 'ajax_tooltip_arrow'; ajax_tooltipObj.appendChild(leftDiv); var contentDiv = document.createElement('DIV'); /* Create tooltip content div */ contentDiv.className = 'ajax_tooltip_content'; ajax_tooltipObj.appendChild(contentDiv); contentDiv.id = 'ajax_tooltip_content'; if(ajax_tooltip_MSIE){ /* Create iframe object for MSIE in order to make the tooltip cover select boxes */ ajax_tooltipObj_iframe = document.createElement('<IFRAME frameborder="0">'); ajax_tooltipObj_iframe.style.position = 'absolute'; ajax_tooltipObj_iframe.border='0'; ajax_tooltipObj_iframe.frameborder=0; ajax_tooltipObj_iframe.style.backgroundColor='#FFF'; ajax_tooltipObj_iframe.src = 'about:blank'; contentDiv.appendChild(ajax_tooltipObj_iframe); ajax_tooltipObj_iframe.style.left = '0px'; ajax_tooltipObj_iframe.style.top = '0px'; } } // Find position of tooltip ajax_tooltipObj.style.display='block'; ajax_loadContent('ajax_tooltip_content',externalFile); if(ajax_tooltip_MSIE){ ajax_tooltipObj_iframe.style.width = ajax_tooltipObj.clientWidth + 'px'; ajax_tooltipObj_iframe.style.height = ajax_tooltipObj.clientHeight + 'px'; } ajax_positionTooltip(inputObj); } function ajax_positionTooltip(inputObj) { var leftPos = (ajaxTooltip_getLeftPos(inputObj) + inputObj.offsetWidth); var topPos = ajaxTooltip_getTopPos(inputObj); var tooltipWidth = document.getElementById('ajax_tooltip_content').offsetWidth + document.getElementById('ajax_tooltip_arrow').offsetWidth; ajax_tooltipObj.style.left = leftPos + 'px'; ajax_tooltipObj.style.top = topPos + 'px'; } function ajax_hideTooltip() { ajax_tooltipObj.style.display='none'; } function ajaxTooltip_getTopPos(inputObj) { var returnValue = inputObj.offsetTop; while((inputObj = inputObj.offsetParent) != null){ if(inputObj.tagName!='HTML')returnValue += inputObj.offsetTop; } return returnValue; } function ajaxTooltip_getLeftPos(inputObj) { var returnValue = inputObj.offsetLeft; while((inputObj = inputObj.offsetParent) != null){ if(inputObj.tagName!='HTML')returnValue += inputObj.offsetLeft; } return returnValue; } Quote Link to comment Share on other sites More sharing options...
Canman2005 Posted September 10, 2009 Author Share Posted September 10, 2009 any ideas? Quote Link to comment Share on other sites More sharing options...
cbolson Posted September 10, 2009 Share Posted September 10, 2009 Hi, The code that you have posted so far is not showing the complete picture. Can you post the *complete* source code (as output by the browser)? And any relevant external js file contents. Chris Quote Link to comment Share on other sites More sharing options...
Canman2005 Posted September 10, 2009 Author Share Posted September 10, 2009 the only other script is the standard ajax one Quote Link to comment Share on other sites More sharing options...
cbolson Posted September 10, 2009 Share Posted September 10, 2009 the only other script is the standard ajax one What do you mean by "the standard ajax one"? From the code that you have pasted there are several problems: The link calls a ajaxLoader() function that is not defined in the js code that you have pasted. You have a function called onclick(), whilst probably not the cause of your problem, I am not sure that this is a good name for a function. How and where is this function onclick() being called? it is certainly not being called by the link... unless the misterious ajaxloader() function is calling it.... Without seeing the complete picture, it is very hard to see where it is going wrong. Chris Quote Link to comment Share on other sites More sharing options...
Canman2005 Posted September 10, 2009 Author Share Posted September 10, 2009 really sorry, that was the wrong code for the link which is being clicked, the correct code is <a onClick="ajax_showTooltip('deletebox.php?id=<?php print $row['id']; ?>',this);return false">click</a> do you need anymore info or code? Quote Link to comment Share on other sites More sharing options...
cbolson Posted September 10, 2009 Share Posted September 10, 2009 Ah, OK, I have now created a test page with the code that you have provided (minus the ajax part) and it works as I expect it to - ie it creates an (empty as I don't have the ajax) layer. There must be something else on your page that is preventing the code from "finding" the tooltip function. That is why I need to see your complete source code (html) Chris Quote Link to comment Share on other sites More sharing options...
Canman2005 Posted September 11, 2009 Author Share Posted September 11, 2009 thanks so far my source code is <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>webinn:</title> <meta name="description" content="x" /> <meta name="keywords" content="x" /> <meta name="Distribution" content="Global" /> <meta name="Robots" content="INDEX,FOLLOW" /> <meta name="Revisit-after" content="7 Days" /> <link href="css/style.css" rel="stylesheet" type="text/css" /> </head> <script language="JavaScript"> numdivs=3 IE5=NN4=NN6=false if(document.all)IE5=true else if(document.layers)NN4=true else if(document.getElementById)NN6=true function init() { showDiv(0) } function showDiv( which ) { for(i=0;i<numdivs;i++) { if(NN4) eval("document.div"+i+".visibility='hidden'") if(IE5) eval("document.all.div"+i+".style.visibility='hidden'") if(NN6) eval("document.getElementById('div"+i+"').style.visibility='hidden'") } if(NN4) eval("document.div"+which+".visibility='visible'") if(IE5) eval("document.all.div"+which+".style.visibility='visible'") if(NN6) eval("document.getElementById('div"+which+"').style.visibility='visible'") } </script> <script src="js/ajax.js" type="text/javascript"></script> <script src="js/ajax-alt.js" type="text/javascript"></script> <script type="text/javascript" src="js/ajax-Tooltip.js"></script> <script type="text/javascript" src="js/ajax-dynamic-content.js"></script> <script> function QuickPreview() { window.open("websitepreview.php","mywindow","menubar=1,resizable=1,width=650,height=450"); } </script> <link rel="stylesheet" type="text/css" href="css/contentslider.css"/> <link rel="stylesheet" href="css/ajax-Tooltip.css" media="screen" type="text/css"> <style> #div0 { position:absolute; width:870px; padding-top:10px; visibility: hidden; } #div1 { position:absolute; width:870px; padding-top:10px; visibility: hidden; } #div2 { position:absolute; width:870px; padding-top:10px; visibility: hidden; } #stripNav1 a { font-size: 18px; text-decoration:none; left:20px; background-color:#6e8906; position:absolute; color: #000000; height:35px; padding-left:36px; padding-right:36px; padding-top:10px; } #stripNav1 a:hover { background:#455409; color:#FFF; height:50px; } #stripNav2 a { font-size: 18px; text-decoration:none; left:150px; background-color:#6e8906; position:absolute; color: #000000; height:35px; padding-left:36px; padding-right:36px; padding-top:10px; } #stripNav2 a:hover { background:#455409; color:#FFF; height:50px; } #stripNav3 a { font-size: 18px; text-decoration:none; left:290px; background-color:#6e8906; position:absolute; color: #000000; height:35px; padding-left:36px; padding-right:36px; padding-top:10px; } #stripNav3 a:hover { background:#455409; color:#FFF; height:50px; } #stripNav4 { font-size: 18px; text-align:right; left:477px; background-color:#a4c134; width:354px; position:absolute; color: #000000; height:35px; padding-left:36px; padding-right:16px; padding-top:10px; } </style> <body onLoad="init()"> <table border="0" cellpadding="4" cellspacing="4"> <tr> <td height="70" align="left" valign="top" class="head"><img src="images/brand.gif" width="171" height="50" /></td> <td width="560" height="70" align="left" valign="top" class="head" style="padding-top:16px; padding-left:40px"><span style="font-size:22px; cursor:pointer" onclick='return QuickPreview()'>http://dasdas.webinn.com</span></td> <td height="70" align="center" valign="top" class="lrgformtext"><a href="logout.php"><img src="images/styleicons/32x32/security_lock.png" width="32" height="32" border="0" /></a><br /><a href="logout.php" style="text-decoration:none"><font color="#000000">logout</font></a></td> </tr> </table> <div id="stripNav4"><img src="images/previewbutton.gif" width="105" height="28" onclick='return QuickPreview()' style="cursor:pointer" /></div> <div id="stripNav3"><a href="javascript:showDiv(2)">Configuration</a></div> <div id="stripNav2"><a href="javascript:showDiv(1)">Content</a></div> <div id="stripNav1"><a href="javascript:showDiv(0)">Design</a></div> <div class="slider-wrap" style="margin-left:10px; padding-top:40px"> <div id="div0"> <p><span class="head"><strong>Design.</strong></span></p> <span id="designrange"><table width="860" border="0" cellpadding="0" cellspacing="0"> <tr> <td align="center" bgcolor="#CCCCCC"><table border="0" cellpadding="0" cellspacing="0"> <tr> <td height="173" align="left"><a href="#" onClick="ajaxLoader('websitelayouts.php?design=1','designrange');" ><img src="images/templates/design1fade.jpg" width="286" height="240" border="0" /></a></td> <td width="8" rowspan="2"></td> <td height="173" align="left"><a href="#" onClick="ajaxLoader('websitelayouts.php?design=2','designrange');" ><img src="images/templates/design2.jpg" width="286" height="240" border="0" /></a></td> <td width="8" rowspan="2"></td> <td height="173" valign="bottom"><a href="#" onClick="ajaxLoader('websitelayouts.php?design=3','designrange');" ><img src="images/templates/design3.jpg" width="286" height="240" border="0" /></a></td> </tr> </table></td> </tr> </table> <div style="background-color:#6e8906; height:32px; padding-left:12px; width:851px; margin-top:50px; margin-bottom:10px; padding-top:10px; font-size: 18px">copyright 2009<span style="float:right; padding-right:12px"><a href="mailto:help@webinn.com" style="text-decoration:none"><font color="#000000">contact us</font></a></span></div></span> </div> <div id="div1"> <p><span class="head"><strong>Content.</strong></span></p> <script src="js/ajax.js" type="text/javascript"></script> <script type="text/javascript"> function ProcessAction() { var action = document.getElementById('action').value; var id = document.getElementById('id').value; var pagetitle = document.getElementById('pagetitle').value; var pagecontent = document.getElementById('pagecontent').value; ajaxLoader('websitecontent.php?action='+action+'&id='+id+'&pagetitle='+pagetitle+'&pagecontent='+pagecontent+'','content'); } </script> <span id="content"> <table border="0" cellpadding="0" cellspacing="0"> <tr> <td height="34" align="left" valign="top" style="padding-right:30px"> <span style="color:#F00; font-weight:bold; padding-top:5px; padding-bottom:5px"></span> <table border="0" cellpadding="0" cellspacing="0"> <tr> <td width="23" height="38" align="left" valign="middle" style="border-bottom:1px #999999 solid"><img src="images/icons/page.png" width="16" height="16" /></td> <td width="220" height="38" align="left" valign="middle" style="border-bottom:1px #999999 solid">Home</td> <td width="30" height="38" align="right" valign="middle" style="border-bottom:1px #999999 solid"><a onClick="ajaxLoader('websitecontent.php?edit=111','content');"><img src="images/icons/page_edit.png" width="16" height="16" border="0" style="cursor:pointer" /></a></td> <td width="26" height="38" align="right" valign="middle" style="border-bottom:1px #999999 solid"></td> </tr> <tr> <td width="23" height="38" align="left" valign="middle" style="border-bottom:1px #999999 solid"><img src="images/icons/page.png" width="16" height="16" /></td> <td width="220" height="38" align="left" valign="middle" style="border-bottom:1px #999999 solid">About Us</td> <td width="30" height="38" align="right" valign="middle" style="border-bottom:1px #999999 solid"><a onClick="ajaxLoader('websitecontent.php?edit=112','content');"><img src="images/icons/page_edit.png" width="16" height="16" border="0" style="cursor:pointer" /></a></td> <td width="26" height="38" align="right" valign="middle" style="border-bottom:1px #999999 solid"><a href="#" onClick="ajax_showTooltip('websitecontentdeletebox.php?id=112',this);return false"><img src="images/icons/cross.png" width="16" height="16" border="0" style="cursor:pointer" /></a></td> </tr> <tr> <td width="23" height="38" align="left" valign="middle" style="border-bottom:1px #999999 solid"><img src="images/icons/page.png" width="16" height="16" /></td> <td width="220" height="38" align="left" valign="middle" style="border-bottom:1px #999999 solid">Contact Us</td> <td width="30" height="38" align="right" valign="middle" style="border-bottom:1px #999999 solid"><a onClick="ajaxLoader('websitecontent.php?edit=113','content');"><img src="images/icons/page_edit.png" width="16" height="16" border="0" style="cursor:pointer" /></a></td> <td width="26" height="38" align="right" valign="middle" style="border-bottom:1px #999999 solid"><a href="#" onClick="ajax_showTooltip('websitecontentdeletebox.php?id=113',this);return false"><img src="images/icons/cross.png" width="16" height="16" border="0" style="cursor:pointer" /></a></td> </tr> <tr> <td height="48" colspan="4" align="left" valign="bottom"><input name="signup" type="button" class="smlformtext" id="button" value="New Page" onClick="ajaxLoader('websitecontent.php','content');" /></td> </tr> </table></td> <td style="padding-right:20px; border-left:1px solid #CCCCCC"> </td> <td align="left" valign="top"> <form name="theForm" id="theForm" method="post" > <table border="0" cellpadding="4" cellspacing="0"> <tr> <td align="left" valign="bottom">Page Title</td> </tr> <tr> <td align="left" valign="middle"><input name="pagetitle" type="text" class="smlformtext" id="pagetitle" size="69" value="" /></td> </tr> <tr> <td height="32" align="left" valign="bottom">Page Content</td> </tr> <tr> <td align="left" valign="top"><textarea name="pagecontent" id="pagecontent" rows="8" class="smlformtext" style="width:500px"></textarea></td> </tr> <tr> <td height="40" align="left" valign="bottom"><input type="button" class="smlformtext" value="Add Page" onclick="return ProcessAction();" /></td> </tr> </table> <input type="hidden" id="action" name="action" value="new" /> <input type="hidden" id="id" name="id" /> </form> </td> </tr> </table> </span> <div style="background-color:#6e8906; height:32px; padding-left:12px; width:851px; margin-top:50px; margin-bottom:10px; padding-top:10px; font-size: 18px">copyright 2009<span style="float:right; padding-right:12px"><a href="mailto:help@webinn.com" style="text-decoration:none"><font color="#000000">contact us</font></a></span></div></div> <div id="div2"> <p><span class="head"><strong>Configuration.</strong></span></p> <span id="configuration"><script type="text/javascript"> function ProcessFinalSave() { var sitetitle = document.getElementById('sitetitle').value; var description = document.getElementById('description').value; var keywords = document.getElementById('keywords').value; javascript:window.location='customise.php?finalsave'; } function ProcessPreview() { var sitetitle = document.getElementById('sitetitle').value; window.open("websitepreview.php?sitetitle="+sitetitle+"","mywindow","menubar=1,resizable=1,width=650,height=450"); } </script> <form method="post" enctype="multipart/form-data" target="websiteconfigurationimg" action="websiteconfigurationimg.php"> <table border="0" cellpadding="4" cellspacing="0"> <tr> <td align="left" valign="bottom">Site Title</td> <td rowspan="7" style="padding-left:20px; border-right:1px solid #CCCCCC"> </td> <td valign="bottom" style="padding-left:20px">Company Logo</td> </tr> <tr> <td height="30" align="left" valign="middle" style="padding-bottom:3px"><input name="sitetitle" type="text" class="smlformtext" id="sitetitle" value="" size="50" /></td> <td valign="bottom" style="padding-left:20px"><input name="image" type="file" class="smlformtext" id="image" size="32" onchange='this.form.submit()' /></td> </tr> <tr> <td height="32" align="left" valign="bottom">Description</td> <td rowspan="4" valign="top" style="padding-left:20px"><iframe name="websiteconfigurationimg" id="websiteconfigurationimg" width="370" height="270" frameborder="0" src="websiteconfigurationimg.php"></iframe></td> </tr> <tr> <td height="30" align="left" valign="top"><textarea name="description" cols="47" rows="4" class="smlformtext" id="description"></textarea></td> </tr> <tr> <td height="32" align="left" valign="bottom">Keywords</td> </tr> <tr> <td height="30" align="left" valign="middle"><textarea name="keywords" cols="47" rows="4" class="smlformtext" id="keywords"></textarea></td> </tr> <tr> <td height="40" align="left" valign="bottom" style="padding-top:3px"><input type="button" class="smlformtext" value="Publish Site" style="margin-right:20px" onclick='return ProcessFinalSave()' /> <input type="button" class="smlformtext" value="Preview Site" onclick='return ProcessPreview()' /></td> <td> </td> </tr> </table> <input type="hidden" name="action" id="action" value="upload" /> </form> <div style="background-color:#6e8906; height:32px; padding-left:12px; width:851px; margin-top:50px; margin-bottom:10px; padding-top:10px; font-size: 18px">copyright 2009<span style="float:right; padding-right:12px"><a href="mailto:help@webinn.com" style="text-decoration:none"><font color="#000000">contact us</font></a></span></div></span> </div> </div> </body> </html> Quote Link to comment Share on other sites More sharing options...
cbolson Posted September 11, 2009 Share Posted September 11, 2009 might be a silly question but, are your javascript files where your code *thinks* they are? I have copied your source code and pasted the tooltops js code directly into it and it doesn't give me the error that you are reporting. Chris Quote Link to comment Share on other sites More sharing options...
Canman2005 Posted September 11, 2009 Author Share Posted September 11, 2009 Yep, I mean it runs on my local server fine, but when put online, it doesn't seem to work Quote Link to comment Share on other sites More sharing options...
cbolson Posted September 11, 2009 Share Posted September 11, 2009 can you post (or send me a pm) with the url? Chris Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.