I have an an iframe within a jQuery tab layout. I am using the iframe to upload an image, to simulate a AJAX file upload. It seems whenever my iframe postbacks, it causes the parent page's $(document).ready to execute, resetting the current tab I am positioned on.
Any ideas on how to prevent this?
function uploadDone() {
var data = eval("("+ $('#upload_target').contents().find('body').html() +")");
if(data.success) {
$('#upload_summary').append("<img src='" + data.full_path + "' />");
$('#upload_summary').append("<br />Size: " + data.file_size + " KB");
}
else if(data.failure) { //Upload failed - show user the reason.
alert("Upload Failed: " + data.failure);
}
}
$(document).ready(function() {
$('#image_uploader').submit(function() {
if($.browser.safari || $.browser.opera) {
$('#upload_target').load(function(){
setTimeout(uploadDone, 0);
});
var iframe = document.getElementById('upload_target');
var iSource = iframe.src;
iframe.src = '';
iframe.src = iSource;
} else {
$('#upload_target').load(uploadDone);
}
});
});