Ajax Json problems with Jquery in Firefox
I am experiencing some troubles using ajax in my jQuery call in order to produce a json response. Basically I am trying to get all the images in a specific directory. Below is my jQuery code, and this works fine for directories with less than about 50 images, but once the number of images is greater than that, Firefox will just abort the request. This works fine in Safari, Chrome, IE. Either they are doing something wrong and Firefox is doing it right, and I am making an error, or this is one of the rare times when Firefox is the culprit. I have tried $.getJSON and disabling caching of the ajax requests, but that does not seem to work either. Any help will be greatly appreciated and thanks in advance.
var activeRequest = false;
var error = "The system could not read the directory at this time.";
var current = this.location['href'];
var filesCache = {};
function addFile(list, varToAdd, path, id){
if (typeof varToAdd != 'undefined' && varToAdd != null ){
var imagePath = path;
var srcPath = path+"/"+varToAdd['file'];
imagePath = "/cms/images/thumbs/"+imagePath+varToAdd['file'];
var filename = varToAdd['file'];
if(filename.length >18){
filename = filename.substr(0, 15)+"...";
}
var fileInfo = '<li id ="'+varToAdd['file'].replace('.', '')+'">';
fileInfo += '<a class = "thumb" href="'+srcPath+'" target="_blank"><img src="'+srcPath+'" width="'+varToAdd['width']+'" height="'+varToAdd['height']+'" alt="'+varToAdd['file']+'" /></a>';
fileInfo += '<ul class="fileInfo"><li title="'+varToAdd['file']+'">'+filename+'</li><li>'+varToAdd['dims']+'px</li><li>'+varToAdd['size']+'kb</li></ul>';
fileInfo += '</li>';
list.append(fileInfo);
delete fileInfo;
}
else
return false;
}
function lookupFiles(path){
var cleanPath = decodeURIComponent(path);
cleanPath += "/";
var urlLookUp = '/cms/images/lookup/file/?path='+encodeURIComponent(cleanPath);
var loader = $(".folder-contents .header");
$.ajaxSetup({
cache: false
});
var ajaxRequest = $.ajax({
type: 'GET',
url: urlLookUp,
data: path,
dataType: 'json',
beforeSend: function (request) {
if(!activeRequest)
loader.addClass('loading');
else
return false;
},
error: function(XMLHttpRequest, textStatus, errorThrown){
loader.addClass('error').removeClass('loading');
alert(error);
},
success: function(response, status, XMLHttpRequest) {
list = $(".folder-contents > ul.files");
if(typeof response != 'undefined' && response != null){
if(status == 'success' && (typeof response.files != 'undefined' && response.count > 0)){
list.empty();
$.each((response.files), function(index, value) {
addFile(list, value, path, response.searchTerm);
});
//list.append('</ul>');
}
else if (status == 'success' && (typeof response.files != 'undefined' && response.count == 0)){
list.empty();
list.append('<li class = "noresults">There are no images in this folder</li>');
}
else{
formLabel.addClass('error').removeClass('loading');
alert('Error');
}
}
loader.removeClass('loading');
开发者_开发知识库 }
});
/*
var json = $.getJSON( urlLookUp+"format=json&jsoncallback=?", function ( data ) {
console.log( data );
} );
*/
}
$(document).ready(function() {
$("a.directory").live('click',function(ev){
ev.preventDefault();
if($(this).hasClass('open')){
$(this).addClass('empty').removeClass('open').html('-');
lookup($(this).attr("title"));
}
else if($(this).hasClass('close')){
$(this).addClass('open').removeClass('close').html('+');
$(this).parent().find('ul').remove();
}
});
$("a.folder").live('click',function(ev){
ev.preventDefault();
lookupFiles($(this).attr("title"));
});
$(".files li").live('click', function(ev){
ev.preventDefault();
// send ckeditor back what image was selected - url from jquery selector & callBack from the view
var fileUrl = $(this).find('a').attr("href");
var callBack = window.CKEditorFuncName;
window.opener.CKEDITOR.tools.callFunction(callBack, fileUrl);
window.close();
});
});
精彩评论