mootools 1.11 .setHTML not working in IE
I am trying to make a form dynamic using mootools 1.11, for specific reasons I cannot upgrade atm.
I'm trying to manipulate a select field to have dynamic options. This works in Firefox & Chrome but not IE8. Hope there's a fix for this.
bits of the code:
myOptions(hrs+1, 23, 'uur');
$('vertrektijd_uur').setHTML('<option value="">Kies uur</option>'+options_uur);
$('vertrektijd_uur').addEvent('change', function() {
hrsChanged = $('vertrektijd_uur').getValue();
hrsChanged = parseInt(hrsChanged);
if(hrs+1 == hrsChanged)
{
myMinutes(parseInt(min));
myOptions(minChanged, 55, 'min');
$('vertrektijd_min').setHTML('<option value="开发者_C百科">Kies minuten</option>'+options_min);
}
else
{
myOptions(0, 55, 'min');
$('vertrektijd_min').setHTML('<option value="">Kies minuten</option>'+options_min);
}
});
I have found a workaround for the IE problem. But now I have another problem. With this new method the new options are added (injected) instead of replacing the old options. It seems I need a way to remove the options prior to injecting. But don't know how I would go about doing this.
code:
var myOptions = function(start, end, field){
// Remove options from select field here then do inject below ??
for (var n = start; n <= end; n++){
if(n < 10){
new Element('option',{'value':'0'+n}).inject(field).setText('0'+n);
} else {
new Element('option',{'value':n}).inject(field).setText(n);
}
}
}
EDIT: I was able to solve it by doing a loop through each option and removing them.
var children = field.getChildren();
children.each(function(option){
option.remove();
});
精彩评论