Solved

Javascript error in IE - onclick

Posted on 2009-05-13
4
957 Views
Last Modified: 2013-12-08
We are using Google translate with a search application for our website. The problem we're having is when a user clicks on the search button. We then get an error. The specifics are in the attached word document with screenshots. The code Is below. This does not occur in Firefox or Safari, just IE 6.x, 7.x


<script type="text/javascript" src="static-hso-files/query-meta"></script>

<script type="text/javascript" src="static-hso-files/jsapi"></script>

<script type="text/javascript">

  google.load("language", "1");

  google.setOnLoadCallback(logo_load);
 

function translatejs(){
 

 var lang_list    = document.getElementById("trans-languages");

 var target_lang  = lang_list.options[lang_list.selectedIndex].value;

 var target_index = lang_list.selectedIndex;

 var searchcntrl  = document.getElementsByName("query")[0].value;

 

 if (target_lang!=null && target_lang!=""){

        if (target_lang!="en"){

         onTranslate(searchcntrl,target_lang,target_index);

        }

        else{

          offTranslate(searchcntrl,target_index);

        }  

 }

 else{

        offTranslate(searchcntrl,target_index);

 } 

}
 

function offTranslate(searchterm,index){

      var reg_url= "http://hso.info/hso/cgi-bin/query-meta?v%3Asources=test-lang-final2-avalon&v%3Aproject=HSO&query="+searchterm+"&index="+index+"&orig_term="+searchterm;

      window.location = reg_url; 

}
 

function onTranslate(searchterm,tl,index){

    google.language.translate(searchterm, tl, "en", function(result)

    {

     if (!result.error) {

      var velocity_url = "http%3A%2F%2Fhso.info%2Fhso%2Fcgi-bin%2Fquery-meta?v%3Asources%3Dtest-lang-final2-avalon%26v%3Aproject%3DHSO%26query%3D"+result.translation+"%26index%3D"+index+"%26orig_term%3D"+searchterm;
 

      window.location = "http://74.125.93.104/translate_c?langpair=en|"+tl+"&hl=en&ie=UTF-8&fx=UTF-8&sl="+tl+"&tl="+tl+"&u="+velocity_url;

     }

   });

}
 

function gup( name )

{

  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");

  var o_url = decode(window.location.href);

  <!--alert("this is decode window.location.href: " + o_url);-->

  var regexS = "[\\?&]"+name+"=([^&#]*)";

<!--  var regexS = "([\\?&]|%26)"+name+"(=|%3D)([^%&#]*).*"; -->

  var regex = new RegExp( regexS );

  var results = regex.exec( o_url );

 

  if( results == null ){

    return "";

  }else{

    return results[1];

  }

}
 

function encode(obj) {

	var unencoded = obj;

	obj.value = escape(unencoded);

return obj;

}
 

function decode(obj) {

        var encoded = obj;

	obj = unescape(encoded.replace(/\+/g,  " "));

return obj;       

}
 

function trans_load() {

  var cur_index = gup('index');

  var lang_list   = document.getElementById("trans-languages");

  var searchcntrl  = document.getElementsByName("query")[0].value;

  var target_lang 

  if(cur_index!=null && cur_index!="" && cur_index>=0) {

    target_lang  = lang_list.options[cur_index].value;

       if (target_lang!=null && target_lang!=""){

            if (target_lang!="en"){

                google.language.translate(searchcntrl, "en", target_lang, function(result){

 if (!result.error) {

      <!--alert("target_lang is:" + target_lang);-->

         	document.getElementsByName("query")[0].value = result.translation; 

     }});

     lang_list.selectedIndex = cur_index;

   }

   else{

       

   }  

  }

 }

<!-- code for fix -->

  var cur_index_retry = gup('tl');

  var lang_listii = document.getElementById("trans-languages");

  lang_listii.value = cur_index_retry;  

  target_lang= cur_index_retry;

  

   if (target_lang!="en"){

                google.language.translate(searchcntrl, "en", target_lang, function(result){

 if (!result.error) {

      <!--alert("target_lang is:" + target_lang);-->

         	document.getElementsByName("query")[0].value = result.translation; 

     }});

   }

  
 

<!-- end code for fix -->   
 

  return false;

}
 

function logo_load(){

   if (top.location  != self.location) { 

     top.location.replace(self.location);

   }     

   trans_load();

   google.language.getBranding("branding");

 }
 

</script>

<script src="static-hso-files/defaulten.js" type="text/javascript"></script>

<body class="project-HSO sources-test-lang-final2-avalon" id="search">

<script type="text/javascript">

var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");

document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));

</script><script src="static-hso-files/ga.js" type="text/javascript"></script><script type="text/javascript">

try {

var pageTracker = _gat._getTracker("UA-4720084-1");

pageTracker._trackPageview();

} catch(err) {}</script><div id="viv-header-extra">

<div id="header">

<table border="0" cellpadding="0" cellspacing="0" width="100%">

<tbody><tr>

<td align="left" valign="bottom" width="460">

<a href="http://hso.info/"><img src="static-hso-files/header-logo-new-tall.jpg" class="imglogo" border="0" width="460" height="100"></a>

</td>

<td align="right" valign="bottom">

 <ul id="tabs">

   <li id="tabs-search"><a href="#">Search</a></li>

   <li id="tabs-contact"><a href="http://hso.info/contact/contact.html">Contact HSO</a></li>

   <li id="tabs-survey"><a href="http://hso.info/survey/survey.html">Survey</a></li>

   <li id="tabs-about"><a href="http://hso.info/about/aboutopen.html" target="new">About</a></li>

   <li id="tabs-help"><a href="http://hso.info/about/help.html">Help</a></li>

   <li id="tabs-support"><a href="http://hso.info/support/donate.html">Support HSO</a></li>

 </ul>

</td>

</tr>

</tbody></table>

</div> </div>

<div id="viv-frontpage"><div id="viv-header" class="clearfix"><div id="header-links"></div></div>

<div id="viv-main" style="margin: 0pt;"><div class="content" style="margin: 0pt auto;"><div id="search-primary" class="search"><div class="search-form">

<form action="http://hso.info/hso/cgi-bin/query-meta" class="search" name="search" onsubmit="try{return translatejs();}catch(e){}">

<div id="libraries"><table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td class="searchboxtop">

<ul id="searchbox-tabs">

<li id="tabs-libraries"><a href="http://hso.info/hso/cgi-bin/query-meta?v:project=HSO&amp;v:sources=test-lang-final2-avalon&amp;" onclick="return viv.page.linkWithQuery('query-meta.exe?v:project=HSO&amp;v:sources=test-lang-final2-avalon')">HSO</a></li><li id="tabs-pubmed"><a href="http://hso.info/hso/cgi-bin/query-meta?v:project=HSO&amp;v:sources=PubMed&amp;" onclick="return viv.page.linkWithQuery('query-meta.exe?v:project=HSO&amp;v:sources=PubMed')">

PubMed</a></li>

<li id="tabs-all"><a href="http://hso.info/hso/cgi-bin/query-meta?v:project=HSO&amp;v:sources=test-lang-final2-avalon%20PubMed&amp;" onclick="return viv.page.linkWithQuery('query-meta.exe?v:project=HSO&amp;v:sources=test-lang-final2-avalon PubMed')">

All

</a></li></ul></td></tr><tr><td class="searchbox-middle" height="55"><div class="searchbox">
 

<input name="search" value="" type="hidden">
 
 

<input value="HSO" name="v:project" type="hidden"><input value="" name="query" size="50" class="query">

<script>document.getElementById('search').focus()</script>

&nbsp;<input name="subII" value="Search" onclick="translatejs();return false;" align="top" type="button"><div id="languagebar" class="notranslate" align="left"><span id="chooselang">Choose Search Language:&nbsp;</span><select id="trans-languages" class="collaborators">

<option value="en">English</option>

<option value="sq">Albanian</option>

<option value="ar">Arabic</option>

<option value="bg">Bulgarian</option>

<option value="ca">Catalan</option>

<option value="zh-CN">Chinese (Simplified)</option>

<option value="zh-TW">Chinese (Traditional)</option>

<option value="hr">Croatian</option>

<option value="cs">Czech</option>

<option value="da">Danish</option>

<option value="nl">Dutch</option>

<option value="et">Estonian</option>

<option value="tl">Filipino</option>

<option value="fi">Finnish</option>

<option value="fr">French</option>

<option value="gl">Galician</option>

<option value="de">German</option>

<option value="el">Greek</option>

<option value="iw">Hebrew</option>

<option value="hi">Hindi</option>

<option value="hu">Hungarian</option>

<option value="id">Indonesian</option>

<option value="it">Italian</option>

<option value="ja">Japanese</option>

<option value="ko">Korean</option>

<option value="lv">Latvian</option>

<option value="lt">Lithuanian</option>

<option value="mt">Maltese</option>

<option value="no">Norwegian</option>

<option value="pl">Polish</option>

<option value="pt">Portuguese</option>

<option value="ro">Romanian</option>

<option value="ru">Russian</option>

<option value="sr">Serbian</option>

<option value="sk">Slovak</option>

<option value="sl">Slovenian</option>

<option value="es">Spanish</option>

<option value="sv">Swedish</option>

<option value="th">Thai</option>

<option value="tr">Turkish</option>

<option value="uk">Ukranian</option>

<option value="vi">Vietnamese</option></select>

<input id="orig-term" name="orig-term" value="" type="hidden">

<input id="index" index="index" value="" type="hidden"></div>

<div class="notranslate" id="branding"><div id="slabel">Translation is&nbsp;</div></div></div></td></tr>

<tr><td height="10"><table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td class="searchbox-bottom" align="left" valign="bottom"><img src="static-hso-files/corner-left-bottom-search.jpg" class="corner-left-bottom" width="10" height="10"></td><td class="searchbox-bottom"><img src="static-hso-files/pixel.gif" class="imgborder"></td><td class="searchbox-bottom" align="right" valign="bottom"><img src="static-hso-files/corner-right-bottom-search.jpg" class="corner-right-bottom" width="10" height="10"></td></tr></tbody></table></td></tr></tbody></table></div></form></div></div></div></div><div id="viv-footer"><div class="content clearfix"><div class="notranslatez"> 

<div class="document-footer">

<div style="" center="">

</div><table class="result-num" border="0" cellpadding="0" cellspacing="0" width="100%">

<tbody><tr>

<td colspan="8" align="center">HSO is the first website to deliver authoritative, comprehensive, free, and ad-free health sciences knowledge.<br>

Search and browse any health sciences topic from over 50,000 courses, references, guidelines, and other learning resources. <br>

Materials are selected from accredited educational sources including

universities, governments, and professional societies, by HSO staff.

<br>

<br>

<span class="collaborators">HSO Founding Collaborators and Funders</span></td>

</tr>

<tr>

</tr>

Open in new window

javascript-IE.doc
0
Comment
Question by:kairosmix
  • 2
4 Comments
 
LVL 10

Accepted Solution

by:
bugada earned 500 total points
ID: 24378894
Probably to show the select "empty" option you set the selectedIndex to -1.
When you're trying to get the selected value you passes as array index, and -1 is invalid. Try to change the line where the error occurs as follows:
var target_lang = lang_list.value;

Open in new window

0
 
LVL 2

Expert Comment

by:IndianHero2001
ID: 24379022
When your page loads, the drop-down box with id="trans-languages" doesn't have anything selected. So, its selectedIndex value is null. So, that makes it lang_list.options[null]. Now, there is no null index or position in lang_list.options so the error!

Just pre-select one of the option as default. So, when page loads, the language box has some value in it.

Replace your select code with code below. I have set English as pre-selected language. You can set your own.
<select id="trans-languages" class="collaborators">

<option value="en" selected="selected">English</option>

<option value="sq">Albanian</option>

<option value="ar">Arabic</option>

<option value="bg">Bulgarian</option>

<option value="ca">Catalan</option>

<option value="zh-CN">Chinese (Simplified)</option>

<option value="zh-TW">Chinese (Traditional)</option>

<option value="hr">Croatian</option>

<option value="cs">Czech</option>

<option value="da">Danish</option>

<option value="nl">Dutch</option>

<option value="et">Estonian</option>

<option value="tl">Filipino</option>

<option value="fi">Finnish</option>

<option value="fr">French</option>

<option value="gl">Galician</option>

<option value="de">German</option>

<option value="el">Greek</option>

<option value="iw">Hebrew</option>

<option value="hi">Hindi</option>

<option value="hu">Hungarian</option>

<option value="id">Indonesian</option>

<option value="it">Italian</option>

<option value="ja">Japanese</option>

<option value="ko">Korean</option>

<option value="lv">Latvian</option>

<option value="lt">Lithuanian</option>

<option value="mt">Maltese</option>

<option value="no">Norwegian</option>

<option value="pl">Polish</option>

<option value="pt">Portuguese</option>

<option value="ro">Romanian</option>

<option value="ru">Russian</option>

<option value="sr">Serbian</option>

<option value="sk">Slovak</option>

<option value="sl">Slovenian</option>

<option value="es">Spanish</option>

<option value="sv">Swedish</option>

<option value="th">Thai</option>

<option value="tr">Turkish</option>

<option value="uk">Ukranian</option>

<option value="vi">Vietnamese</option></select>

Open in new window

0
 

Author Comment

by:kairosmix
ID: 24379922
Hi, thanks, I did change the code with english set as the default, as you suggested, using your code, but I still got the error message in IE and the default language does not appear. However, the solution just suggested by someone else to change the code where the error occured to this:
var target_lang = lang_list.value;
worked in that it is now behaving correctly onclick and the default search is English, though I am still perplexed as to why the value of ENglish does not appear in the dropdown, but the behavior is okay.
0
 

Author Closing Comment

by:kairosmix
ID: 31581186
I changed the code to your suggestion and it worked.!!! Thank you!!
 though I am still perplexed as to why the value of ENglish does not appear in the dropdown, but the behavior is okay and that was what I needed most!
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Internet is a big network which is formed by connecting multiple small networks.It is a platform for all the users which are connected to it.Internet act as platform in different fields. Such as: Internet  as a collaboration platform. Internet  as…
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
Google currently has a new report that is in beta and coming soon to Webmaster Tool accounts. This Micro Tutorial will highlight new features for Google Webmaster Tools.
Shows how to create a shortcut to site-search Experts Exchange using Google in the Chrome browser. This eliminates the need to type out site:experts-exchange.com whenever you want to search the site. Launch the Search Engine Menu: In chrome, via you…

757 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

21 Experts available now in Live!

Get 1:1 Help Now