[jQuery] Cross-browser problem
Hello everyone! I wrote this script and it doesn't work in IE6 & IE7
and Chrome, but works in last Firefox and last Opera. In IE it simply
doesn't list <option></option> at all and doesn't react on current_cat
variables at all.
If i set all "current" variables to 0 it shows all data, but doesn't
react on <option> click event.
Firebug doesn't show any problems, tried to check all values with -
console.log(); and they all contain proper values as it seems.
Please help me to find a problem.
console.log(current_cat1,current_cat2,current_cat3);
null1 null2 null3
0 null2 null3
0 0 null3
0 0 0
var current_cat1 = 'null1';
var current_cat2 = 'null2';
var current_cat3 = 'null3';
function call_cats() {
fill_cat1();
fill_cat2();
fill_cat3();
}
function fill_cat1() {
$('#cat1').html('');
var selected = '';
var cat1 = $('#cat1');
cat1.prepend('<option id="null1" value="null1"></option>');
var i = 0;
while(i <= main_cats['main_cat_rows'] - 1) {
if(current_cat1 == 'null1') {
$('#null1', cat1).remove();
cat1.prepend('<option id="null1" value="null1" selected></
option>');
current_cat2 = 'null2';current_cat3 = 'null3';
}
if(current_cat1 == i){var selected = 'selected';
cat1.append('<option ' + selected + ' value="' + i + '">' +
main_cats['main_cat'][i] + '</option>');
i++;
}
cat1.append('<option value="' + i + '">' + main_cats['main_cat'][i]
+ '</option>');
i++;
}
$('#cat1 option').bind("click", function(){current_cat1 = $(this).attr
('value'); call_cats();});
}
function fill_cat2() {
$('#cat2').html('');
var selected = '';
var cat2 = $('#cat2');
cat2.prepend('<option id="null2" value="null2"></option>');
var i = 0;
while(i <= sub_cats['list_rows'][current_cat1] - 1) {
if(current_cat2 == 'null2') {
$('#null2', cat2).remove();
cat2.prepend('<option id="null2" value="null2" selected></
option>');
current_cat3 = 'null3';
}
if(current_cat2 == i){var selected = 'selected';
cat2.append('<option ' + selected + ' value="' + i + '">' + sub_cats
['list_all'][current_cat1][i] + '</option>');
i++;
}
cat2.append('<option value="' + i + '">' + sub_cats['list_all']
[current_cat1][i] + '</option>');
i++;
}
$('#cat2 option').bind("click", function(){current_cat2 = $(this).attr
('value'); call_cats();});
}
function fill_cat3() {
$('#cat3').html('');
var selected = '';
var cat3 = $('#cat3');
cat3.prepend('<option id="null3" value="null3"></option>');
var i = 0;
while(i <= sub_cats['list_sub_rows'][current_cat2] - 1) {
if(current_cat3 == 'null3') {$('#null3', cat3).remove();cat3.prepend
('<option id="null3" value="null3" selected></option>');}
if(current_cat3 == i){var selected = 'selected';
cat3.append('<option ' + selected + ' value="' + i + '">' + sub_cats
['sub_list'][current_cat1][current_cat2][i] + '</option>');
i++;
}
cat3.append('<option value="' + i + '">' + sub_cats['sub_list']
[current_cat1][current_cat2][i] + '</option>');
i++;
}
$('#cat3 option').bind("click", function(){current_cat3 = $(this).attr
('value'); call_cats();});
}