Ver Mensaje Individual
  #1 (permalink)  
Antiguo 14/07/2011, 16:56
Avatar de kaninox
kaninox
 
Fecha de Ingreso: septiembre-2005
Ubicación: In my House
Mensajes: 3.597
Antigüedad: 18 años, 8 meses
Puntos: 49
Script ara subir archivo con ajax

Hola muchachos, he estado probando como subir archivos con ajax y pues me he encontrado con infinidad de script que lo hacen pero con muchos archivos y me encontre este que funciona muy bien, al menos para mi caso.

Código PHP:
Ver original
  1. <?php
  2. if($_FILES['archivo']){
  3.     if(10240000 > $_FILES['archivo']['size']){
  4.         $tmp = $_FILES['archivo']['tmp_name'];
  5.         $name = $_FILES['archivo']['name'];
  6.         $name = "tucarpeta/$name";
  7.         if(move_uploaded_file($tmp, $name)){
  8.             echo '
  9.            <script>
  10.            parent.document.getElementById("loading").style.display="none";
  11.            parent.document.getElementById("mensaje").innerHTML="Archivo grabado correctamente";
  12.            old_f=parent.document.getElementById("archivo");
  13.            new_f=parent.document.createElement("input");
  14.            new_f.type="file";
  15.            new_f.name="archivo";
  16.            new_f.value="";
  17.            new_f.id="archivo";
  18.               new_f.onchange=function(){
  19.                parent.document.getElementById("mensaje").innerHTML="";
  20.            }
  21.            old_f.parentNode.replaceChild(new_f,old_f);
  22.            </script>';
  23.             exit;
  24.         }
  25.     }
  26. echo '
  27.            <script>
  28.            parent.document.getElementById("loading").style.display="none";
  29.            parent.document.getElementById("mensaje").innerHTML="El archivo no pudo grabarse.";
  30.            old_f=parent.document.getElementById("archivo");
  31.            new_f=parent.document.createElement("input");
  32.            new_f.type="file";
  33.            new_f.name="archivo";
  34.            new_f.value="";
  35.            new_f.id="archivo";
  36.               new_f.onchange=function(){
  37.                parent.document.getElementById("mensaje").innerHTML="";
  38.            }
  39.            old_f.parentNode.replaceChild(new_f,old_f);
  40.            </script>';
  41. }
  42. ?>
  43. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  44. <html xmlns="http://www.w3.org/1999/xhtml">
  45. <head>
  46. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  47. <title>test</title>
  48. </head>
  49. <body>
  50. <?php echo "$_POST[archivo] - $_GET[archivo]";?>
  51. <form target="pepe" method="post" enctype="multipart/form-data" action="<?php echo basename($_SERVER['PHP_SELF'])?>" onsubmit="if(document.getElementById('archivo').value.length)document.getElementById('loading').style.display='inline'">
  52. <div id="mensaje" style="font-family:Verdana, Arial, Helvetica, sans-serif; color:red; font-size:9px"></div>
  53. <input type="file" name="archivo" id="archivo" size="26" class="campoArchivo" onchange="document.getElementById('mensaje').innerHTML=''" />
  54. <input type="submit" value="Cargar archivo" /><img id="loading" src="?LOADING" width="16" height="16" style="display:none" />
  55. </form>
  56. <iframe name="pepe" width="1" height="1" style="visibility:hidden">aaa</iframe>
  57. </body>
  58. </html>

el script funciona bien el problema es que necesito agregar este archivo file en un formulario que tengo con otros scripts ajaxs, y con otro tipo de funcion para enviar via onsubmit, la funcion que ocupo es esta

Código Javascript:
Ver original
  1. <script type="text/javascript">
  2. function form103(){var params = Form.serialize($('formulario_103'));
  3. new Ajax.Updater('bodychange', 'formulario_103.php', {asynchronous:true, parameters:params, evalScripts: true, onCreate: function() {toggleLoader(false);},
  4. onComplete: function(){
  5. toggleLoader(true);
  6.  if($('cfx')){
  7.     new Effect.Pulsate('cfx', { pulses: 4, duration: 1.8, queue: {scope: 'cfxscope'}});  
  8.  }
  9.  if($('cfa')){
  10.     new Effect.Pulsate('cfa', { pulses: 4, duration: 1.8, queue: {scope: 'cfascope'}});    
  11.     new Effect.Fade('cfa', { duration: 7.0, queue: {position: 'end', scope: 'cfascope'} });
  12.  }
  13. }
  14. });}
  15.  
  16. function toggleLoader(show) {  
  17. $('ContenidoFormulario')[show ? 'show' : 'hide']();
  18. $('ContenidoCargando')[!show ? 'show' : 'hide']();
  19. }
  20. </script>

y su form es :

Código PHP:
Ver original
  1. <form name="formulario" enctype="multipart/form-data" id="formulario_103" method="post" action="formulario_103.php" onsubmit="form103();return false;" style="margin:0;padding:0;">


y yo necesito saber como o donde tendría que agregar esto :

Código PHP:
Ver original
  1. if(document.getElementById('archivo').value.length)document.getElementById('loading').style.display='inline';

lo he tratado de agregar directamente en el script despues de los cfa, y me sube la imagen pero ya no me ejecuta el ajax, digo me tira mi pagina como parent y me la saca, no se si me explico, esta pagina la cargo en una capa y al agregar este codigo me ejecuta la pagina no en la capa si no que completamente y ya no me sirve :/ alguna ayuda, estoy usando a todo esto prototype y scriptaculous.

Saludos.
__________________
Gokuh Salvo al mundo. PUNTO!!!!