I am trying to wrap my head around this issue, but don't see what causes the error, I have following function that gets errors only in ie8 and due to this breaks all jQuery functionality as well as other JavaScript bits. (function is located inside app.js file)
function visitorAges(category, number) {
// Ages for adults
if (category == 'adult') {
var arrayAges = ['18 - 20', '21 - 30', '31 - 40', '41 - 50', '51 - 60', '60 +'];
}
// Ages for children
else if (category == 'child') {
var arrayAges = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17];
}
// Populate related select menu with options
$('#visit_'+category+'_ages').empty();
for (var i=1; i<=number; i++ ) {
var $ageLabel = $('<label/>', {for: 'visit_'+category+'-'+i+'_age', text: category+' '+i});
var $ageSelect = $('<select/>', {name: 'visit_'+category+'-'+i+'_age', id: 'visit_'+category+'-'+i+'_age', class: 'form-control'});
$.each(arrayAges, function(index, value){
$ageSelect.append($('<option/>', {text: value}));
})
$('#visit_'+category+'_ages').append($ageLabel, $ageSelect).fadeIn();
}
} /* END visitorAges() */
The errors I get in IE8 console are as follows:
Expected identifier, string or number 'app.js, line 99 character 35'
var arrayAges = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17];
and
Expected identifier, string or number 'app.js, line 104 character 35'
var $ageLabel = $('<label/>', {for: 'visit_'+category+'-'+i+'_age', text: category+' '+i});
So, as I said in my comments, IE requires keywords to be wrapped in quotes when they are not used as keywords, such as the one below. Notice the keywords for, class etc.
var $ageLabel = $('<label/>', {for: 'visit_'+category+'-'+i+'_age', text: category+' '+i});
var $ageSelect = $('<select/>', {name: 'visit_'+category+'-'+i+'_age', id: 'visit_'+category+'-'+i+'_age', class: 'form-control'});
So, all we need to do is to wrap them as below which works in all browsers.
var $ageLabel = $('<label/>', {'for': 'visit_'+category+'-'+i+'_age', 'text': category+' '+i});
var $ageSelect = $('<select/>', {'name': 'visit_'+category+'-'+i+'_age', 'id': 'visit_'+category+'-'+i+'_age', 'class': 'form-control'});
P.S. I have wrapped all keys just to be consistent.