Foros del Web » Programando para Internet » PHP »

Upload Form barra de progreso o animacion

Estas en el tema de Upload Form barra de progreso o animacion en el foro de PHP en Foros del Web. Hola!! Me gustaria saber donde puedo encontrar algun tipo de barra de progresso o gif animado para una formularo de subida de archivos, busque con ...
  #1 (permalink)  
Antiguo 04/02/2009, 14:49
Avatar de fechasoru  
Fecha de Ingreso: diciembre-2008
Mensajes: 149
Antigüedad: 11 años, 1 mes
Puntos: 0
Upload Form barra de progreso o animacion

Hola!!
Me gustaria saber donde puedo encontrar algun tipo de barra de progresso o gif animado para una formularo de subida de archivos, busque con el google y no encontre nada aun.
Tengo hecho el formulario upload que permite enviar hasta 7.5 mb y necesito alguna animacion que indique al usuario que se esta procesando.
Desde ya saludos.
  #2 (permalink)  
Antiguo 04/02/2009, 14:58
Avatar de Ronruby  
Fecha de Ingreso: julio-2008
Ubicación: 18°30'N, 69°59'W
Mensajes: 4.879
Antigüedad: 11 años, 7 meses
Puntos: 416
Respuesta: Upload Form barra de progreso o animacion

Eso lo logras con AJAX.

Prueba usando el FancyUpload. Buscalo en Google.
  #3 (permalink)  
Antiguo 04/02/2009, 19:37
Avatar de fechasoru  
Fecha de Ingreso: diciembre-2008
Mensajes: 149
Antigüedad: 11 años, 1 mes
Puntos: 0
Respuesta: Upload Form barra de progreso o animacion

Necesito una alternativa diferente a lo que vos me das , ya lo tengo hecho al formulario , no solamente carga en cierto directorio el archivo sino tambien graba en la base de datos link y otros datos mas.
Lo que necesito es poner algo que indique se esta subieno el archivo no mas , no es necesario que sea ajax , algun indicativo , por ejemplo cuando entro a este foro siempre ahy una barrita verde que se mueve , que sea algun gif o algo en javascript no mas.

este es mi script de subida

Código php:
Ver original
  1. <?php
  2. include_once 'Upload.class.php';
  3. include_once 'ezpdo/ezpdo_runtime.php';
  4. //include 'verificar_session.php';
  5.  
  6.  
  7.  
  8. $upload = new Upload;
  9.  
  10. if (!empty($_POST['action']) && $_POST['action'] == 'upload') {
  11.     $archivo;
  12.    try {
  13.    
  14.     $m=epManager::instance();
  15.     $categoria=$m->get('Categoria',$_POST['categoria']);
  16.    
  17.    
  18.     $path="/archivos/carpeta_".$_POST['seccion']."_".$categoria->denominacion;
  19.        
  20.     //$_FILES['userfile']['name']=$_FILES['userfile']['name'].'-'.date('Y-m-d-H-i-s');
  21.    
  22.     $upload->uploadFile($path, 'latin', 10);
  23.        
  24.    
  25.     $m->start_t();
  26.    
  27.    
  28.     $files=$upload->_files;
  29.     $archivo=$m->create('Archivo');
  30.     $archivo->titulo=$_POST['titulo'];
  31.    
  32.    
  33.     foreach ($files as $key=>$value)
  34.     {
  35.         $archivo->nombre_archivo=$value;
  36.         $archivo->path='../'.$path.'/'.$value;
  37.         $archivo->dir='../'.$path;
  38.        
  39.     }
  40.    
  41.       $archivo->descripcion=$_POST['descripcion'];
  42.       $archivo->dia=date('d');
  43.       $archivo->mes=date('m');
  44.       $archivo->ano=date('Y');
  45.              
  46.    
  47.     $categoria=$m->get('Categoria',$_POST['categoria']);
  48.    
  49.     $categoria->archivo_categoria[]=$archivo;
  50.    
  51.     $m->commit_t();
  52.    
  53.    
  54.    }
  55.    catch (Exception $ex)
  56.    {
  57.       echo "Error al subir el archivo";
  58.      
  59.      
  60.    }
  61.    
  62.  
  63.    
  64.     ?>
  65.    
  66.     <script>
  67.         setTimeout('document.location="archivo_nuevo.php?oid=<?php echo $_GET["oid"];?>"',1000);
  68.     </script>
  69.        
  70.     <?php
  71.    
  72.     ?>
  73.           <link rel="stylesheet" href="estilo_boton.css" type="text/css" media="screen" />
  74.      
  75.     <?php
  76.     print ("
  77.            <p align='center'>
  78.            Se subio con exito el archivo al Servidor<br>
  79.            Nombre del Archivo: $archivo->nombre_archivo<br>
  80.            </p>
  81.            <p align='center'style='color:#00F'>
  82.            Link de Descarga del Archivo  $archivo->path<p>
  83.            </p>
  84.            <p align='center'>
  85.            <a href='$archivo->path' class='enlaceboton'>Descargar</a><br>
  86.            Titulo descriptivo del Documento: $archivo->titulo
  87.            </p>
  88.            ");
  89.    
  90.    
  91.    
  92. }
  93.  
  94. $m=epManager::instance();
  95. $secciones=$m->get('Seccion');
  96. $band=false;
  97. $oid=1;
  98.  
  99. if(isset($_GET['oid']))
  100. {
  101.     $band=true;
  102.     $oid=$_GET['oid'];
  103.    
  104. }
  105.  
  106. if(isset($_GET['oid'])&& isset($_GET['text_categoria']) && $_GET['text_categoria']!="" )
  107. {
  108.     try {
  109.        
  110.         $s=$m->get('Seccion',$_GET['oid']);
  111.         $nueva_cat=$m->create('Categoria');
  112.         $nueva_cat->denominacion=$_GET['text_categoria'];
  113.         $s->categoria_seccion[]=$nueva_cat;
  114.         $m->flush();
  115.        
  116.     }
  117.     catch (Exception $ex)
  118.     {
  119.      echo $ex->getMessage();   
  120.        
  121.     }
  122.    
  123. }
  124.  
  125.  
  126. ?>
  127.  
  128. <head>
  129. <link rel="stylesheet" href="estilo_tablas.css" type="text/css" media="screen" />
  130. <link rel="stylesheet" href="estilo_texto.css" type="text/css" media="screen" />
  131. <link rel="stylesheet" href="estilo_boton.css" type="text/css" media="screen" />
  132.  
  133.  
  134. <script type="text/javascript">
  135.  
  136. function volver()
  137. {
  138. //var x = document.getElementById("combo").value;
  139. document.location = "archivo_gestion.php";
  140.  
  141.  
  142. }
  143. /*
  144. function enviar()
  145. {
  146. var x = document.getElementById("seccion").value;
  147. document.location = "archivo_nuevo.php?oid="+x ;
  148.  
  149. }
  150. */
  151. function nueva_categoria()
  152. {
  153. var x = document.getElementById("seccion").value;
  154. var y = document.getElementById("text_categoria").value;
  155.  
  156. document.location = "archivo_nuevo.php?oid="+x+"&"+"text_categoria="+y;
  157.  
  158. }
  159.  
  160. function eliminar_categoria()
  161. {
  162. var x = document.getElementById("seccion").value;
  163. var y = document.getElementById("text_categoria").value;
  164.  
  165. document.location = "archivo_nuevo.php?oid="+x+"&"+"text_categoria="+y;
  166.  
  167. }
  168.  
  169.  
  170. function validar()
  171. {
  172.       if (document.form1.titulo.value.length==0)
  173.       {
  174.            alert("Tiene que Ingresar un Titulo Descriptivo del Archivo ");
  175.            document.form1.titulo.focus();
  176.            return false;
  177.        }
  178.       else if(document.form1.descripcion.value.length==0)
  179.       {
  180.           alert("Tiene que Ingresar una Descripción");
  181.           document.form1.descripcion.focus();
  182.           return false;
  183.          
  184.       }
  185.       else if(document.form1.categoria.value.length==0)
  186.       {
  187.           alert("Cree una nueva Categoria sino Existe");
  188.           document.form1.descripcion.focus();
  189.           return false;
  190.          
  191.       }
  192.       else if(document.form1.userfile.value.length==0)
  193.      {
  194.           alert(" Debe Seleccionar un Archivo. Extensiones permitidas jpg,jpeg,bmp,png,doc,txt,gif,xml,rtf,pdf,xls,rar,tar,zip,tgz,gz ");
  195.           document.form1.userfile.focus();
  196.           return false;
  197.    
  198.       }
  199.      
  200. }
  201.  
  202. </script>
  203. </head>
  204. <body>
  205. <table>
  206. <tr>
  207. <td>
  208. <p align="center">Subir un Nuevo Archivo al Sitio Web</p>
  209. <p>
  210. Suba un nuevo archivo, para que pueda ser descargados por los usuarios del Sitio Web, ejemplo Documentos, Formularios, Reglamentos en formato Word, Excel.<br>
  211. Los formatos de archivos permitidos son: jpg,jpeg,bmp,png,doc,txt,gif,xml,rtf,pdf,xls,rar,tar,zip,tgz,gz y no deben superar los 7.5 MB.<br>
  212. Seleccione una Seccion y Categoría donde almacenar el Archivo.  
  213. </p>
  214. <p>
  215.  
  216.     <form name="form1" action="archivo_nuevo.php" method="post" enctype="multipart/form-data" onsubmit="return validar();">
  217.     <p align="center">
  218.     <label>
  219.     Tipo de Documento:
  220.     <select name="seccion" id="seccion" onChange="enviar();">
  221.     <?php
  222.      
  223.      foreach ($secciones as $s)
  224.      {
  225.        if($s->oid==$_GET['oid'])
  226.        {
  227.         echo '<option value="'.$s->oid.'" selected>'.$s->denominacion.'</option>';
  228.            
  229.        }else
  230.        {
  231.         echo '<option value="'.$s->oid.'">'.$s->denominacion.'</option>';
  232.    
  233.        }
  234.      
  235.      }
  236.  
  237.      ?>
  238.      
  239.     </select>
  240.     </label>
  241.     </p>
  242.     <p align="center">
  243.       <label>
  244.       Categoría del Documento:
  245.    
  246.       <select name="categoria" id="categoria ">
  247.      
  248.       <?php
  249.      
  250.       $seccion=$m->get('Seccion',$oid);
  251.      
  252.       $categorias=$seccion->categoria_seccion;
  253.      
  254.       if(!isset($categorias))
  255.       {
  256.  
  257.         echo '<option value=""></option>';
  258.        
  259.        
  260.       }
  261.       else
  262.       {
  263.      foreach ($categorias as $cat)
  264.      {
  265.        
  266.         echo '<option value="'.$cat->oid.'">'.$cat->denominacion.'</option>';
  267.    
  268.        
  269.      
  270.      }
  271.      
  272.       }
  273.  
  274.      ?>
  275.      
  276.        </select>
  277.       </label>
  278.       <label>Agregar Categoria
  279.       <input type="text" id="text_categoria" name="text_categoria" size="20" maxlength="100">
  280.       </label>
  281.      
  282.       <button type="button" OnClick="nueva_categoria();">Agregar</button>
  283.            
  284.      </p>
  285.    
  286.     <p align="center">
  287.       <label>Titulo del Documento ha Subir:
  288.       <input type="text" name="titulo" size="20" maxlength="100">
  289.       </label>
  290.       <input type="hidden" name="MAX_FILE_SIZE" value="8000000">
  291.   </p>
  292.      <p align="center">
  293.        <label>
  294.          Descripción breve del Documento ha subir que permita al usuario conocer, cual es su contenido y fin de uso.
  295.          <textarea name="descripcion" id="descripcion" cols="45" rows="5"></textarea>
  296.        </label>
  297.      </p>
  298.      <br>
  299.      <p align="center">
  300.       <label>
  301.       Archivo ha Subir:
  302.       <input name="userfile" type="file">
  303.       </label>
  304.     </p>
  305.     <p  align="center"><br>
  306.       <input type="submit" value="Subir Documento">
  307.       <input name="salir" type="button" onclick="volver();" value="Salir"/>
  308.     </p>
  309.     <input type="hidden" name="action" value="upload">
  310.    
  311. </form>
  312. </td>
  313. </tr>
  314. </table>
  315. </body>

Última edición por GatorV; 04/02/2009 a las 19:48
  #4 (permalink)  
Antiguo 04/02/2009, 19:49
Avatar de GatorV
$this->role('moderador');
 
Fecha de Ingreso: mayo-2006
Ubicación: /home/ams/
Mensajes: 38.567
Antigüedad: 13 años, 8 meses
Puntos: 2135
Respuesta: Upload Form barra de progreso o animacion

Hola fechasoru,

Eso lo resuelves entonces con Javascript no con PHP, ya que es un evento que se ejecuta en el cliente.

Saludos
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Tema Cerrado




La zona horaria es GMT -6. Ahora son las 06:56.