Internet explorer only executing function inside jQuery ajax success response once even though there
Posted
by user249950
on Stack Overflow
See other posts from Stack Overflow
or by user249950
Published on 2010-02-16T17:14:51Z
Indexed on
2010/05/21
5:00 UTC
Read the original article
Hit count: 505
Hi,
I have a function that uses jQuery.load() to call in 3 snippets of forms from different pages and then on the success text status it tries to load a colour picker:
$(document).ready(function() {
function ajax_form(putloadingboxhere, putsnippethere, snippeturl) {
$(putsnippethere).load(snippeturl, function (responseText, textStatus, XMLHttpRequest, ) {
if (textStatus == "success") {
alert('One')
$("input.pickcolor").ColorPicker({
onShow: function (colpkr) {
$(colpkr).fadeIn(500);
return false;
},
onSubmit: function(hsb, hex, rgb, el) {
$(el).val(hex);
$(el).ColorPickerHide();
$(el).siblings('.colorpreview').css('background-color', '#' + hex);
},
onBeforeShow: function () {
$(this).ColorPickerSetColor(this.value);
}
})
.bind('keyup', function(){
$(this).ColorPickerSetColor(this.value);
});
alert('Two')
}
if (textStatus == "error") {
// Show error message
}
});
}
ajax_form('tab_box', '#formone', 'snippet_one.htm #snippet');
ajax_form('tab_box', '#formtwo', 'snippet_two_copy.htm #snippet');
ajax_form('tab_box', '#formthree', 'snippet_three.htm #snippet');
});
It works fine in Firefox and Safari but (surprise, surprise) IE has a problem with it. I have added an alert to see what is going on before and after one of the functions.
FF & Safari & IE8: Alert 'one' and Alert 'two' appear three times as expected and colour picker appears. IE6 & 7: Alert 'one' shows three times and colour picker does not appear.
Any help would be great! Cheers.
EDIT
The line IE is referring to when it throws this error: 'Error: Object doesn't support this property or method.' is:
$('input.pickcolor').ColorPicker
Anyone got any insights? Thanks
© Stack Overflow or respective owner