2011-12-24 18 views
18

Estoy usando el complemento de carga de archivos ajax desde PHP Letter y estoy usando jQuery 1.6.2. Los archivos se cargan correctamente, pero no puedo usar los datos JSON devueltos desde el script php, cuando comprobar el error de JavaScript consolse soy yo saludé con este error,Ajax upload plugin throwing jQuery.handleError no encontrado

"Uncaught TypeError: Object function (a,b){return new e.fn.init(a,b,h)} has no method 'handleError'"

en cromo y

"jQuery.handleError is not a function"

en Firefox.

¿Alguien tiene una experiencia similar?

Respuesta

46

Fue cuando estás tratando de usar esto con la última versión de jQuery. La función handleError se deprecia desde la biblioteca superior a la V 1.5. Lo resuelvo simplemente agregando esta función en mi archivo ajaxfileupload.js.

handleError: function(s, xhr, status, e) { 
    // If a local callback was specified, fire it 
    if (s.error) { 
     s.error.call(s.context || window, xhr, status, e); 
    } 

    // Fire the global callback 
    if (s.global) { 
     (s.context ? jQuery(s.context) : jQuery.event).trigger("ajaxError", [xhr, s, e]); 
    } 
} 

y funciona bien para mí. Además, si intentas utilizar cualquier ajaxSubmit() en la misma página, no funcionará, así que utilizo el formulario normal enviado con ajxfileupload. si alguien puede ayudar de la misma manera, por favor hágamelo saber.

+0

Agregué su código pero sigo recibiendo el mismo error – Uahmed

+1

Es posible que esté haciendo algo mal al agregar el código. –

+2

Sí Govind tiene razón me faltaba "," antes de handleError, lo siento, soy nuevo en esto :) Gracias funciona – Uahmed

1

El ejemplo usa jQuery 1.2.1;

http://www.phpletter.com/javascript/jquery.js

la jQuery.handleError() se retiró hace un tiempo, no estoy seguro de cuándo.

Necesita usar una versión anterior de jQuery, actualice la secuencia de comandos usted mismo o intente encontrar una secuencia de comandos actualizada. Pruebe http://valums.com/ajax-upload/ o busque unos pocos pero recuerde consultar su última fecha de actualización.

0

He encontrado un plugin similar y modded para que se adapte a mis necesidades, gracias por el cara a cara acerca de la eliminación de los $ .handleError()

3

http://forum.phpletter.com/viewtopic.php?f=8&t=3044

moderna jQuery no tienen la jQuery. handleError (s, xml, status, e) método.

Por lo tanto, en caso de error, el cargador de archivos cuelga todos los javascripts.

Este script de carga es pequeño, elegante y agradable. Sin embargo, es bastante viejo y jQuery ha rediseñado completamente la entrega de ajax desde entonces. La próxima vez, voy a tratar de utilizar un script moderno complejo con una barra de progreso y arrastrar y soltar apoyo: http://valums.com/ajax-upload/

lo contrario, para el código heredado o simplicidad razones, encontrará esta revisión de ajaxfileupload.js (Versión 2.1) útil: Tenga en cuenta que el evento global "ajaxError" no es compatible.

 

    jQuery.extend({ 


     createUploadIframe: function(id, uri) 
     { 
      //create frame 
       var frameId = 'jUploadFrame' + id; 
       var iframeHtml = ''; 
      jQuery(iframeHtml).appendTo(document.body); 

       return jQuery('#' + frameId).get(0);   
     }, 
     createUploadForm: function(id, fileElementId, data) 
     { 
      //create form 
      var formId = 'jUploadForm' + id; 
      var fileId = 'jUploadFile' + id; 
      var form = jQuery(''); 
      if(data) 
      { 
      for(var i in data) 
      { 
       jQuery('').appendTo(form); 
      }   
      }  
      var oldElement = jQuery('#' + fileElementId); 
      var newElement = jQuery(oldElement).clone(); 
      jQuery(oldElement).attr('id', fileId); 
      jQuery(oldElement).before(newElement); 
      jQuery(oldElement).appendTo(form); 



      //set attributes 
      jQuery(form).css('position', 'absolute'); 
      jQuery(form).css('top', '-1200px'); 
      jQuery(form).css('left', '-1200px'); 
      jQuery(form).appendTo('body');  
      return form; 
     }, 

     ajaxFileUpload: function(s) { 
      // TODO introduce global settings, allowing the client to modify them for all requests, not only timeout  
      s = jQuery.extend({}, jQuery.ajaxSettings, s); 
      var id = new Date().getTime()  
      var form = jQuery.createUploadForm(id, s.fileElementId, (typeof(s.data)=='undefined'?false:s.data)); 
      var io = jQuery.createUploadIframe(id, s.secureuri); 
      var frameId = 'jUploadFrame' + id; 
      var formId = 'jUploadForm' + id;  
      // Watch for a new set of requests 
      if (s.global && ! jQuery.active++) 
      { 
      jQuery.event.trigger("ajaxStart"); 
      }   
      var requestDone = false; 
      // Create the request object 
      var xml = {} 
      if (s.global) 
       jQuery.event.trigger("ajaxSend", [xml, s]); 
      // Wait for a response to come back 
      var uploadCallback = function(isTimeout) 
      {   
      var io = document.getElementById(frameId); 
       try 
      {    
       if(io.contentWindow) 
       { 
        xml.responseText = io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null; 
         xml.responseXML = io.contentWindow.document.XMLDocument?io.contentWindow.document.XMLDocument:io.contentWindow.document; 

       }else if(io.contentDocument) 
       { 
        xml.responseText = io.contentDocument.document.body?io.contentDocument.document.body.innerHTML:null; 
         xml.responseXML = io.contentDocument.document.XMLDocument?io.contentDocument.document.XMLDocument:io.contentDocument.document; 
       }     
       }catch(e) 
      { 
       jQuery.my_handleError(s, xml, null, e); 
      } 
       if (xml || isTimeout == "timeout") 
      {    
        requestDone = true; 
        var status; 
        try { 
         status = isTimeout != "timeout" ? "success" : "error"; 
         // Make sure that the request was successful or notmodified 
         if (status != "error") 
        { 
          // process the data (runs the xml through httpData regardless of callback) 
          var data = jQuery.uploadHttpData(xml, s.dataType); 
          // If a local callback was specified, fire it and pass it the data 
          if (s.success) 
           s.success(data, status); 

          // Fire the global callback 
          if(s.global) 
           jQuery.event.trigger("ajaxSuccess", [xml, s]); 
         } else 
          jQuery.my_handleError(s, xml, status); 
        } catch(e) 
       { 
         status = "error"; 
         jQuery.my_handleError(s, xml, status, e); 
        } 

        // The request was completed 
        if(s.global) 
         jQuery.event.trigger("ajaxComplete", [xml, s]); 

        // Handle the global AJAX counter 
        if (s.global && ! --jQuery.active) 
         jQuery.event.trigger("ajaxStop"); 

        // Process result 
        if (s.complete) 
         s.complete(xml, status); 

        jQuery(io).unbind() 

        setTimeout(function() 
           { try 
            { 
            jQuery(io).remove(); 
            jQuery(form).remove(); 

            } catch(e) 
            { 
            jQuery.my_handleError(s, xml, null, e); 
            }       

           }, 100) 

        xml = null 

       } 
      } 
      // Timeout checker 
      if (s.timeout > 0) 
      { 
       setTimeout(function(){ 
        // Check to see if the request is still happening 
        if(!requestDone) uploadCallback("timeout"); 
       }, s.timeout); 
      } 
      try 
      { 

      var form = jQuery('#' + formId); 
      jQuery(form).attr('action', s.url); 
      jQuery(form).attr('method', 'POST'); 
      jQuery(form).attr('target', frameId); 
       if(form.encoding) 
      { 
       jQuery(form).attr('encoding', 'multipart/form-data');    
       } 
       else 
      { 
       jQuery(form).attr('enctype', 'multipart/form-data');   
       }   
       jQuery(form).submit(); 

      } catch(e) 
      {   
       jQuery.my_handleError(s, xml, null, e); 
      } 

      jQuery('#' + frameId).load(uploadCallback ); 
      return {abort: function() {}}; 

     }, 

     uploadHttpData: function(r, type) { 
      var data = !type; 
      data = type == "xml" || data ? r.responseXML : r.responseText; 
      // If the type is "script", eval it in global context 
      if (type == "script") 
       jQuery.globalEval(data); 
      // Get the JavaScript object, if JSON is used. 
      if (type == "json") 
       eval("data = " + data); 
      // evaluate scripts within html 
      if (type == "html") 
       jQuery("").html(data).evalScripts(); 
      //alert($('param', data).each(function(){alert($(this).attr('value'));})); 
      return data; 
     }, 

     /* jQuery 1.2 function substitution: */ 
     my_handleError: function(s, xhr, status, e) { 
      // If a local callback was specified, fire it 
      if (s.error) s.error(xhr, status, e); 

      // Fire the global callback 
        /* INCOMPATIBLE!!! Modern jQuery 1.5+ expects xhr to be an jqXHR object. 
      if (s.global) 
      jQuery.event.trigger("ajaxError", [xhr, s, e]); 
          */ 
     } 
    }) 

0

Este artículo aplica la carga AJAX bien y explica aunque es para codeigniter.Lo hizo el trabajo para mí, excepto que tuve que reemplazar

tipoDatos: 'json'

por

tipoDatos: 'html'

parece tiene algún problema con JSON

también relativa url no funcionó para mí, así que puse una url absoluta.

url   :'http://localhost/satyam/LifeBook/places/upload_file', 

y no a foreget Obviosly tiene que escribir la función handlError en el archivo ajaxupload.js hasta el final. http://www.kovloq.com/2011/10/23/ajax-upload-using-codeigniter/

2

También uso este complemento y existe cierta incompatibilidad con las nuevas versiones de jQuery. Uso jquery-1.9.1.js en mi proyecto.

El complemento se utiliza con jquery-1.2.1.js.

He encontrado una solución en un sitio web chino: http://chen-h.iteye.com/blog/1769457 He probado esta versión y funciona. Las devoluciones de llamada ahora están bien.

No hablo chino, pero me imagino que el desarrollador ha convertido este complemento para la nueva versión de Jquery.

jQuery.extend({ 
handleError: function(s, xhr, status, e)  { 
    // If a local callback was specified, fire it 
      if (s.error) { 
       s.error.call(s.context || s, xhr, status, e); 
      } 

      // Fire the global callback 
      if (s.global) { 
       (s.context ? jQuery(s.context) : jQuery.event).trigger("ajaxError", [xhr, s, e]); 
      } 
}, 
createUploadIframe: function(id, uri) 
{ 

    var frameId = 'jUploadFrame' + id; 

    if(window.ActiveXObject) { 
     if(jQuery.browser.version=="9.0") 
     { 
      io = document.createElement('iframe'); 
      io.id = frameId; 
      io.name = frameId; 
     } 
     else if(jQuery.browser.version=="6.0" || jQuery.browser.version=="7.0" || jQuery.browser.version=="8.0") 
     { 

      var io = document.createElement('<iframe id="' + frameId + '" name="' + frameId + '" />'); 
      if(typeof uri== 'boolean'){ 
       io.src = 'javascript:false'; 
      } 
      else if(typeof uri== 'string'){ 
       io.src = uri; 
      } 
     } 
    } 
    else { 
     var io = document.createElement('iframe'); 
     io.id = frameId; 
     io.name = frameId; 
    } 
    io.style.position = 'absolute'; 
    io.style.top = '-1000px'; 
    io.style.left = '-1000px'; 

    document.body.appendChild(io); 

    return io;  
}, 
ajaxUpload:function(s,xml){ 
    //if((fromFiles.nodeType&&!((fileList=fromFiles.files)&&fileList[0].name))) 

    var uid = new Date().getTime(),idIO='jUploadFrame'+uid,_this=this; 
    var jIO=$('<iframe name="'+idIO+'" id="'+idIO+'" style="display:none">').appendTo('body'); 
    var jForm=$('<form action="'+s.url+'" target="'+idIO+'" method="post" enctype="multipart/form-data"></form>').appendTo('body'); 
    var oldElement = $('#'+s.fileElementId); 
    var newElement = $(oldElement).clone(); 
    $(oldElement).attr('id', 'jUploadFile'+uid); 
    $(oldElement).before(newElement); 
    $(oldElement).appendTo(jForm); 

    this.remove=function() 
    { 
     if(_this!==null) 
     { 
      jNewFile.before(jOldFile).remove(); 
      jIO.remove();jForm.remove(); 
      _this=null; 
     } 
    } 
    this.onLoad=function(){ 

     var data=$(jIO[0].contentWindow.document.body).text(); 


     try{ 

      if(data!=undefined){ 
       data = eval('(' + data + ')'); 
       try { 

        if (s.success) 
         s.success(data, status); 

        // Fire the global callback 
        if(s.global) 
         jQuery.event.trigger("ajaxSuccess", [xml, s]); 
        if (s.complete) 
         s.complete(data, status); 
        xml = null; 
        } catch(e) 
        { 

        status = "error"; 
        jQuery.handleError(s, xml, status, e); 
        } 

        // The request was completed 
        if(s.global) 
         jQuery.event.trigger("ajaxComplete", [xml, s]); 
        // Handle the global AJAX counter 
        if (s.global && ! --jQuery.active) 
         jQuery.event.trigger("ajaxStop"); 

        // Process result 

      } 
    }catch(ex){ 
     alert(ex.message); 
    }; 
    } 
    this.start=function(){jForm.submit();jIO.load(_this.onLoad);}; 
    return this; 

}, 
createUploadForm: function(id, url,fileElementId, data) 
{ 
    //create form 
    var formId = 'jUploadForm' + id; 
    var fileId = 'jUploadFile' + id; 
    var form = jQuery('<form action="'+url+'" method="POST" name="' + formId + '" id="' + formId + '" enctype="multipart/form-data"></form>'); 
    if(data) 
    { 
     for(var i in data) 
     { 
      jQuery('<input type="hidden" name="' + i + '" value="' + data[i] + '" />').appendTo(form); 
     }   
    } 

    var oldElement = jQuery('#' + fileElementId); 
    var newElement = jQuery(oldElement).clone(); 
    jQuery(oldElement).attr('id', fileId); 
    jQuery(oldElement).before(newElement); 
    jQuery(oldElement).appendTo(form); 

    //set attributes 
    jQuery(form).css('position', 'absolute'); 
    jQuery(form).css('top', '-1200px'); 
    jQuery(form).css('left', '-1200px'); 
    jQuery(form).appendTo('body');  
    return form; 
}, 
ajaxFileUpload: function(s) { 
    // TODO introduce global settings, allowing the client to modify them for all requests, not only timeout  
    // Create the request object 
    var xml = {}; 
    s = jQuery.extend({}, jQuery.ajaxSettings, s); 
    if(window.ActiveXObject){ 
     var upload = new jQuery.ajaxUpload(s,xml); 
     upload.start(); 

    }else{ 
    var id = new Date().getTime(); 
    var form = jQuery.createUploadForm(id,s.url, s.fileElementId, (typeof(s.data)=='undefined'?false:s.data)); 
    var io = jQuery.createUploadIframe(id, s.secureuri); 
    var frameId = 'jUploadFrame' + id; 
    var formId = 'jUploadForm' + id;   
    // Watch for a new set of requests 
    if (s.global && ! jQuery.active++) 
    { 
     jQuery.event.trigger("ajaxStart"); 
    }    
    var requestDone = false; 

    if (s.global) 
     jQuery.event.trigger("ajaxSend", [xml, s]); 
    // Wait for a response to come back 
    var uploadCallback = function(isTimeout) 
    {   
     var io = document.getElementById(frameId); 

     try 
     {    
      if(io.contentWindow) 
      { 
       xml.responseText = io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null; 
       xml.responseXML = io.contentWindow.document.XMLDocument?io.contentWindow.document.XMLDocument:io.contentWindow.document; 

      }else if(io.contentDocument) 
      { 
       xml.responseText = io.contentDocument.document.body?io.contentDocument.document.body.innerHTML:null; 
       xml.responseXML = io.contentDocument.document.XMLDocument?io.contentDocument.document.XMLDocument:io.contentDocument.document; 
      }      
     }catch(e) 
     { 
      jQuery.handleError(s, xml, null, e); 
     } 
     if (xml || isTimeout == "timeout") 
     {    
      requestDone = true; 
      var status; 
      try { 
       status = isTimeout != "timeout" ? "success" : "error"; 
       // Make sure that the request was successful or notmodified 
       if (status != "error") 
       { 
        // process the data (runs the xml through httpData regardless of callback) 
        var data = jQuery.uploadHttpData(xml, s.dataType);  
        // If a local callback was specified, fire it and pass it the data 

        if (s.success) 
         s.success(data, status); 

        // Fire the global callback 
        if(s.global) 
         jQuery.event.trigger("ajaxSuccess", [xml, s]); 
        if (s.complete) 
         s.complete(data, status); 

       } else 
        jQuery.handleError(s, xml, status); 
      } catch(e) 
      { 
       status = "error"; 
       jQuery.handleError(s, xml, status, e); 
      } 

      // The request was completed 
      if(s.global) 
       jQuery.event.trigger("ajaxComplete", [xml, s]); 
      // Handle the global AJAX counter 
      if (s.global && ! --jQuery.active) 
       jQuery.event.trigger("ajaxStop"); 

      // Process result 
      jQuery(io).unbind(); 

      setTimeout(function() 
           { try 
            { 
             jQuery(io).remove(); 
             jQuery(form).remove(); 

            } catch(e) 
            { 
             jQuery.handleError(s, xml, null, e); 
            }         

           }, 100); 

      xml = null; 

     } 
    }; 
    // Timeout checker 
    if (s.timeout>0) 
    { 
     setTimeout(function(){ 
      // Check to see if the request is still happening 
      if(!requestDone) uploadCallback("timeout"); 
     }, s.timeout); 
    } 

     try 
      { 

       var form = jQuery('#' + formId); 
       jQuery(form).attr('action', s.url); 
       jQuery(form).attr('method', 'POST'); 
       jQuery(form).attr('target', frameId); 

       if(form.encoding) 
       { 
        jQuery(form).attr('encoding', 'multipart/form-data');    
       } 
       else 
       { 
        jQuery(form).attr('enctype', 'multipart/form-data');    
       } 


       jQuery(form).submit(); 

      } catch(e) 
      { 
       jQuery.handleError(s, xml, null, e); 
      } 

      jQuery('#'+ frameId).load(uploadCallback); 
      return {abort: function() {}}; 

    } 
}, 

uploadHttpData: function(r, type) { 

    var data = !type; 
    data = type == "xml" || data ? r.responseXML : r.responseText; 
    // If the type is "script", eval it in global context 
    if (type == "script") 
     jQuery.globalEval(data); 
    // Get the JavaScript object, if JSON is used. 
    if (type == "json"){ 

     eval("data = " + $(data).html()); 
    } 
    // evaluate scripts within html 
    if (type == "html") 
     jQuery("<div>").html(data).evalScripts(); 

    return data; 
} 
}); 
Cuestiones relacionadas