Back To Programming / Scripting / Coding Forum

Javascript works in IE, Safari, Chrome, but not FF or Opera

  • savagestudio
  • Born
  • Born
  • No Avatar
  • Joined: Sep 02, 2010
  • Posts: 2
  • Status: Offline

Post September 2nd, 2010, 5:07 am

hello i have a probleme with a javascript that work on IE, safari,Chrome but doesn't in firefox or opera :

it is a simple script that erase and rewrite the content of 2 select list/menu from an 2 array.. I will apreciate some help on this one, here is the code that write the option of the select menu:
i will put all the script and highlight where is the problem:

Code: [ Select ]
<script language="javascript">//(arrays are empty for space)

var sub_cat_array = new Array(); //1st array for 2nd list
var sub_cat_array2 = new Array(); //2nd array for 3rd list

window.onload=function(){
document.getElementById("hidden_elements").style.display="none";
document.getElementById("hidden_elements2").style.display="none";
document.getElementById("markedslist").onchange=selcted;
document.getElementById("subcat1").onchange=selcted2;
  }
  
  function selcted(){
    document.getElementById("hidden_elements").style.display="none";//reset
    document.getElementById("hidden_elements2").style.display="none";//reset
    if(document.getElementById("markedslist").value !="all"){
    document.getElementById("hidden_elements").style.display="block";
    
    
    }else{  
    document.getElementById("hidden_elements").style.display="none";
    document.getElementById("hidden_elements2").style.display="none";
    }
    var markedslist=this.value;
    var sub_cat=document.getElementById("subcat1");  
    sub_cat.options.length=0;

//probleme start here
    
  ] for(var i=0;i< sub_cat_array.length; i++){
      var st = sub_cat_array[i][0];
      if(st==markedslist){
        var opt = new Option(sub_cat_array[i][1]);
      //  var val = sub_cat_array[i][2];
        opt.value=sub_cat_array[i][2];
        try{
          sub_cat.add(opt,opt.value);
          }catch(e){
            sub_cat.add(opt);
            }
        }
      
      }
    } // probleme finish here and it is the same for the function selcted2 below


  function selcted2(){
    if(document.getElementById("subcat1").value != "all"){
    document.getElementById("hidden_elements2").style.display="block";
    }else{  document.getElementById("hidden_elements2").style.display="none";
    }  
      var subcat1=this.value;
    var sub_cat2=document.getElementById("subcat2");  
    sub_cat2.options.length=0;
    
    for(var i=0;i< sub_cat_array2.length; i++){
      var st2 = sub_cat_array2[i][0];
      if(st2==subcat1){
        var opt2 = new Option(sub_cat_array2[i][1]);
        //var val2 = sub_cat_array2[i][2];
        opt2.value=sub_cat_array2[i][2];
        try{
          sub_cat2.add(opt2,opt2.value);
          }catch(e){
            sub_cat2.add(opt2);
            }
        }
      
      }
    }
</script>
  1. <script language="javascript">//(arrays are empty for space)
  3. var sub_cat_array = new Array(); //1st array for 2nd list
  4. var sub_cat_array2 = new Array(); //2nd array for 3rd list
  6. window.onload=function(){
  7. document.getElementById("hidden_elements").style.display="none";
  8. document.getElementById("hidden_elements2").style.display="none";
  9. document.getElementById("markedslist").onchange=selcted;
  10. document.getElementById("subcat1").onchange=selcted2;
  11.   }
  12.   
  13.   function selcted(){
  14.     document.getElementById("hidden_elements").style.display="none";//reset
  15.     document.getElementById("hidden_elements2").style.display="none";//reset
  16.     if(document.getElementById("markedslist").value !="all"){
  17.     document.getElementById("hidden_elements").style.display="block";
  18.     
  19.     
  20.     }else{  
  21.     document.getElementById("hidden_elements").style.display="none";
  22.     document.getElementById("hidden_elements2").style.display="none";
  23.     }
  24.     var markedslist=this.value;
  25.     var sub_cat=document.getElementById("subcat1");  
  26.     sub_cat.options.length=0;
  28. //probleme start here
  29.     
  30.   ] for(var i=0;i< sub_cat_array.length; i++){
  31.       var st = sub_cat_array[i][0];
  32.       if(st==markedslist){
  33.         var opt = new Option(sub_cat_array[i][1]);
  34.       //  var val = sub_cat_array[i][2];
  35.         opt.value=sub_cat_array[i][2];
  36.         try{
  37.           sub_cat.add(opt,opt.value);
  38.           }catch(e){
  39.             sub_cat.add(opt);
  40.             }
  41.         }
  42.       
  43.       }
  44.     } // probleme finish here and it is the same for the function selcted2 below
  47.   function selcted2(){
  48.     if(document.getElementById("subcat1").value != "all"){
  49.     document.getElementById("hidden_elements2").style.display="block";
  50.     }else{  document.getElementById("hidden_elements2").style.display="none";
  51.     }  
  52.       var subcat1=this.value;
  53.     var sub_cat2=document.getElementById("subcat2");  
  54.     sub_cat2.options.length=0;
  55.     
  56.     for(var i=0;i< sub_cat_array2.length; i++){
  57.       var st2 = sub_cat_array2[i][0];
  58.       if(st2==subcat1){
  59.         var opt2 = new Option(sub_cat_array2[i][1]);
  60.         //var val2 = sub_cat_array2[i][2];
  61.         opt2.value=sub_cat_array2[i][2];
  62.         try{
  63.           sub_cat2.add(opt2,opt2.value);
  64.           }catch(e){
  65.             sub_cat2.add(opt2);
  66.             }
  67.         }
  68.       
  69.       }
  70.     }
  71. </script>

here the body


Code: [ Select ]
<form id="form1" name="form1" method="post" action="">

<table width="778" border="0" id="markedsearch" cellpadding="0" cellspacing="5">
<tr>
  <td width="70" rowspan="2" align="center" valign="top" bgcolor="#000000" ><img src="<?php echo HTTP_SERVER;?>images/sok.jpg" width="70" height="50" /></td>
  <td width="200" align="left" ><select name="groupe1" class="listSize" id="markedslist">
   <option style="color:blue" value="all">Alle rubrikker</option>
   <option value="ein">Eiendom</option>
   <option value="bil">Bill</option>
   <option value="boa">B&aring;t</option>
   <option value="job">Jobb</option>
   <option value="tor">Torget</option>
  </select></td>
  <td width="172" align="left" > <div id="hidden_elements"><select class="listSize" name="groupe3" size="1" id="subcat1">
  </select> </div> </td>
  <td width="172" align="left" ><div id="hidden_elements2"><select class="listSize" name="groupe2" size="1" id="subcat2">
  </select></div></td>
  <td width="142" rowspan="2" align="center" valign="middle" ><input type="submit" name="submitmarked" id="submitmarked" class="submitmarked" value="Søk" /></td>
  </tr>
<tr align="left">
   <td colspan="3" align="center" valign="middle"><input name="criteria" class="searchimput_marked" type="text" id="criteria" size="60" />     </td>
  </tr>

</table>
</form>
  1. <form id="form1" name="form1" method="post" action="">
  3. <table width="778" border="0" id="markedsearch" cellpadding="0" cellspacing="5">
  4. <tr>
  5.   <td width="70" rowspan="2" align="center" valign="top" bgcolor="#000000" ><img src="<?php echo HTTP_SERVER;?>images/sok.jpg" width="70" height="50" /></td>
  6.   <td width="200" align="left" ><select name="groupe1" class="listSize" id="markedslist">
  7.    <option style="color:blue" value="all">Alle rubrikker</option>
  8.    <option value="ein">Eiendom</option>
  9.    <option value="bil">Bill</option>
  10.    <option value="boa">B&aring;t</option>
  11.    <option value="job">Jobb</option>
  12.    <option value="tor">Torget</option>
  13.   </select></td>
  14.   <td width="172" align="left" > <div id="hidden_elements"><select class="listSize" name="groupe3" size="1" id="subcat1">
  15.   </select> </div> </td>
  16.   <td width="172" align="left" ><div id="hidden_elements2"><select class="listSize" name="groupe2" size="1" id="subcat2">
  17.   </select></div></td>
  18.   <td width="142" rowspan="2" align="center" valign="middle" ><input type="submit" name="submitmarked" id="submitmarked" class="submitmarked" value="Søk" /></td>
  19.   </tr>
  20. <tr align="left">
  21.    <td colspan="3" align="center" valign="middle"><input name="criteria" class="searchimput_marked" type="text" id="criteria" size="60" />     </td>
  22.   </tr>
  24. </table>
  25. </form>
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post September 2nd, 2010, 5:07 am

  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Joined: Mar 12, 2007
  • Posts: 6228
  • Loc: South-Africa
  • Status: Offline

Post September 3rd, 2010, 2:19 am

I don't see where you have hilighted the issue ... Anyhow, that is not the end of the world. I suggest you take a look at jQuery ... that could help you out a lot.
Let's leave all our *plum* where it is and go live in the jungle ...
  • savagestudio
  • Born
  • Born
  • No Avatar
  • Joined: Sep 02, 2010
  • Posts: 2
  • Status: Offline

Post September 5th, 2010, 2:18 am

Sorry for the Hiligth , the color didn't work inside the code tag ....i will look at Jquery thanks.... but the asnswer of my problem was that :

THIS:
try{
sub_cat2.options[sub_cat2.length] = new Option(sub_cat_array2[i][1],sub_cat_array2[i][2])
}catch(e){
sub_cat.add(opt,opt.value);

}

INSTEAD OF :

try{
sub_cat.add(opt,opt.value);
}catch(e){
sub_cat.add(opt);
}
FOR BOTH FUNCTION selcted() and selcted2()

THANKS FOR ANSWERING

Page 1 of 1

Post Information

  • Total Posts in this topic: 3 posts
  • Users browsing this forum: No registered users and 155 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 2011 Unmelted, LLC. Ozzu® is a registered trademark of Unmelted, LLC.