Foros del Web » Programando para Internet » Javascript » Frameworks JS »

subir un archivo usando AJAX

Estas en el tema de subir un archivo usando AJAX en el foro de Frameworks JS en Foros del Web. Hola a todos! He estado mirando por la web pero no he conseguido encontrar nada a ver si me podeis ayudar. ¿Se puede subir un ...
  #1 (permalink)  
Antiguo 21/05/2009, 04:25
 
Fecha de Ingreso: enero-2009
Mensajes: 148
Antigüedad: 15 años, 3 meses
Puntos: 0
subir un archivo usando AJAX

Hola a todos!

He estado mirando por la web pero no he conseguido encontrar nada a ver si me podeis ayudar.

¿Se puede subir un archivo utilizando AJAX de tal manera que no se refresque la página?

Lo que he encontrado es todo con Php pero yo necesito utilizando servlets.

Mi idea era que el formulario llame a una funcion javascript que cree el elemento XMLHttpRequest y abra un servlet donde se suba el archivo y devuelva una respuesta que se procese en AJAX y mostrar el resultado sin refrescar la página.

Asi parece fácil je pero la verdad que no se como hacerlo.

¿Sabeis si se puede y como hacerlo?

Un saludo
  #2 (permalink)  
Antiguo 21/05/2009, 09:48
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Respuesta: subir un archivo usando AJAX

Hola:

Los objetos Ajax no admiten el enctype (cabecera) multipart/form-data, que es imprescindible para subir ficheros, y los datos que se pasan por post deben ser del tipo dato=contenido, y no hay forma de leer ese contenido (es del sistema del cliente/usuario)... La técnica que usan los sistemas que simulan Ajax es enviando un formulario a un iframe oculto...

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #3 (permalink)  
Antiguo 22/05/2009, 02:46
 
Fecha de Ingreso: enero-2009
Mensajes: 148
Antigüedad: 15 años, 3 meses
Puntos: 0
Respuesta: subir un archivo usando AJAX

Ahh yo por eso tenía mis dudas de como mandar el fichero porque yo utilizo la librería fileupload y se hacerlo con un servlet pero se recarga la página, no sabía como hacerlo para que no se recargue la página.

Sabes de algún sitio que explique como utilizar lo del iframe oculto. Para intentar ponerlo en práctica.

Un saludo
  #4 (permalink)  
Antiguo 02/10/2009, 05:43
 
Fecha de Ingreso: agosto-2009
Mensajes: 101
Antigüedad: 14 años, 8 meses
Puntos: 0
Respuesta: subir un archivo usando AJAX

Rescato el tema
¿conseguiste resolver el tema del iFrame oculto? A ver si me puedes ayudar, porque quiero hacer lo mismo que tu.
  #5 (permalink)  
Antiguo 02/10/2009, 10:25
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Respuesta: subir un archivo usando AJAX

Hola:

Se oculta un iframe aplicando estilos... por ejemplo display: none;... el resto es ponerle un nombre que coincida con el target del formulario que tenga el campo file para subir... lo demás intenta hacerlo.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #6 (permalink)  
Antiguo 02/10/2009, 23:56
Avatar de conkerick  
Fecha de Ingreso: febrero-2009
Ubicación: WWW
Mensajes: 75
Antigüedad: 15 años, 2 meses
Puntos: 2
Respuesta: subir un archivo usando AJAX

Si no tienes problemas en usar un framework como jQuery, entonces esto te pude servir.

Saludos.
  #7 (permalink)  
Antiguo 06/10/2009, 08:58
 
Fecha de Ingreso: agosto-2009
Mensajes: 101
Antigüedad: 14 años, 8 meses
Puntos: 0
Respuesta: subir un archivo usando AJAX

Bueno .... en realidad, lo que quiero hacer el algo más complicado .... o al menos, eso creo yo!

Explico lo que hago:
1.- Tengo un formulario
2.- Al enviar, lo hace a una función JavaScript donde mediante AJAX es capaz de leer los campos del formulario, y envialo a ASPAdd.asp
3.- ASPadd.asp recibe los datos del formulario, e inserta un registro en una base de datos
4.- Una vez el registro se ha insertado correctamente, hace un Response.Redirect a otra página donde me lista el contenido de la tabla

Hasta el 4º paso, lo tengo todo OK.

Lo que quiero es saber si a partir de la ruta del fichero (que la recibe ASPadd.asp), puedo proceder a "copiar" el fichero a una ruta concreta dentro del servidor!

El form:
Código FORMULARIO:
Ver original
  1. <form method="POST" action="javascript:cargaDocs('showdata','../documentos/aspadd.asp?idSolicitud=<%=sidSolicitud%>')"  name="frm">
  2.     <input type="hidden" name="link" size="15" value="<%=Link%>">
  3.                         <center><br>
  4.                         <table class="dtablaview" width="90%">
  5. <tr>
  6. <td class="tdclase2" width="10%"><input type="text" id="fecha" name="fecha" size="10" value="<%=vfecha%>"></td>
  7.       <td class="tdclase2">
  8.      <!-- input type="text" name="idTipoDoc" size="75" value="<%=vidTipoDoc%>" -->
  9.      <!-- #include file="../cbotiposdocs.asp" -->
  10.      </td>
  11.       <td class="tdclase2"><input type="file" id="doc" name="Doc" size="75" value="<%=vDoc%>"></td>
  12.       <td class="tdclase2">
  13.     <input type="text" id="ruta" name="Ruta" size="15" value="<%=vRuta%>"></td>
  14.       <td class="tdclase2">
  15.      <input type="text" id="idsolicitud" name="idSolicitud" size="8" value="<%=sidSolicitud%>"></td>
  16.  
  17.                 <td><input type="submit" value="Insertar" name="B1"  class="boton"></td>
  18. <td width="10%"><a href="#" OnClick="JavaScript:cargaSolapa('inci','../documentos/listing2.asp?idsolicitud=<%=sidSolicitud%>',0)">Cancelar</a></td>
  19.  
  20. </tr>
  21.  
  22. </table>
  23.  
  24.             </form>

LA función AJAX:
Código AJAX:
Ver original
  1. function cargaDocs(selectDestino,aspDestino)
  2. {
  3.        
  4.         ajax=nuevoAjax();
  5.         ;
  6.         // Envio al servidor a que lea la página
  7.         var vv1 = document.getElementById('idtipodoc').value;
  8.         var vv2 = document.getElementById('fecha').value;
  9.         var vv3 = document.getElementById('idsolicitud').value;
  10.         var vv4 = document.getElementById('doc').value;
  11.         var vv5 = document.getElementById('ruta').value;
  12.        
  13.         // alert(vv3);
  14.         vlink = "../documentos/listing.asp?idSolicitud=" + vv3;
  15.         var queryString = "&idtipodoc=" + vv1 + "&fecha=" + vv2 + "&doc=" + vv4 + "&ruta=" + vv5 + "&link=" + vlink;
  16.          alert(queryString);
  17.         ajax.open("GET", aspDestino+queryString, true);
  18.         ajax.onreadystatechange=function()
  19.         {
  20.             if (ajax.readyState==4)
  21.             {
  22.                 // alert(ajax.responseText);
  23.                 document.getElementById(selectDestino).innerHTML = ajax.responseText;
  24.                 // var selected =  document.getElementById(selectOrigen);
  25.                 // document.getElementById(selectDestino).disabled=false    ;
  26.                 }
  27.             }
  28.         ajax.send(null);
  29. }


La página que Inserta el registro ASPadd.asp
Código ASPadd:
Ver original
  1. <%@ Language=VBScript %>
  2. <!-- #include file="../inc/javascript.asp" -->
  3.  
  4. <%on error resume next
  5.  
  6. Dim strLocation, iLength
  7. Dim iFieldCount
  8. Dim FirstHalfSQL, SecondHalfSQL, EndSQL
  9. Dim SQLInsert
  10.  
  11. Set adoConnection = server.CreateObject("ADODB.Connection")
  12. Set adoRS = server.CreateObject("ADODB.Recordset")
  13. adoConnection.Provider = "Microsoft.Jet.OLEDB.4.0"
  14.  
  15.     strLocation = Request.ServerVariables("PATH_TRANSLATED")
  16.     iLength = Len(strLocation)
  17.     iLength = iLength - 10
  18.  
  19.  
  20.     strLocation = Left(strLocation, iLength)
  21.     strLocation = strLocation & "../database/zsp_gest.mdb"
  22.  
  23.     adoConnection.Open ("Data Source=" & strLocation)
  24.     iFieldCount = 0
  25.  
  26.     FirstHalfSQL = "insert into [Documentos] ("
  27.     SecondHalfSQL = ") Values ("
  28.     EndSQL = ")"
  29.     sDefault = FirstHalfSQL & SecondHalfSQL & EndSQL
  30.  
  31. varLink = request("link")
  32. if len(varLink) = 0 then
  33.     varLink = "../documentos/add.asp?successful=true"
  34.     varLink = "../documentos/getdata.asp"
  35. end if
  36. varLinkDup = "../documentos/add.asp?duplicatedata=true"
  37. varLinkND = "../documentos/add.asp?nodata=true"
  38. varLinkInv = "../documentos/add.asp?invaliddata="
  39.  
  40. varidTipoDoc = request("idTipoDoc")
  41. If varidTipoDoc <> "" then
  42.    iFieldCount = iFieldCount + 1
  43.    On Error Resume Next
  44.    varidTipoDoc = CDbl(varidTipoDoc)
  45.    If Err.Number = 13 Then
  46.        response.redirect (varLinkInv & "Tipo de Documento")
  47.    End If
  48.    Err.Clear
  49.    On Error GoTo 0
  50.    If iFieldCount = 1 Then
  51.        FirstHalfSQL = FirstHalfSQL & "[idTipoDoc]"
  52.        SecondHalfSQL = SecondHalfSQL & varidTipoDoc
  53.    Else
  54.        FirstHalfSQL = FirstHalfSQL & ",[idTipoDoc]"
  55.        SecondHalfSQL = SecondHalfSQL & "," & varidTipoDoc
  56.    End If
  57. End If
  58.  
  59. varfecha = request("fecha")
  60. If varfecha <> "" then
  61.    iFieldCount = iFieldCount + 1
  62.    On Error Resume Next
  63.    varfecha = CDate(varfecha)
  64.    varfecha = CreaFecha(varfecha)
  65.    If Err.Number = 13 Then
  66.        response.redirect (varLinkInv & "Fecha")
  67.    End If
  68.    Err.Clear
  69.    On Error GoTo 0
  70.    If iFieldCount = 1 Then
  71.        FirstHalfSQL = FirstHalfSQL & "[fecha]"
  72.        SecondHalfSQL = SecondHalfSQL & "#" & varfecha & "#"
  73.    Else
  74.        FirstHalfSQL = FirstHalfSQL & ",[fecha]"
  75.        SecondHalfSQL = SecondHalfSQL & ",#" & varfecha & "#"
  76.    End If
  77. End If
  78.  
  79.  
  80. varDoc = request("Doc")
  81. If varDoc <> "" then
  82.    iFieldCount = iFieldCount + 1
  83.    varDoc = Replace(varDoc, "'", "''")
  84.    If iFieldCount = 1 Then
  85.        FirstHalfSQL = FirstHalfSQL & "[Doc]"
  86.        SecondHalfSQL = SecondHalfSQL & "'" & varDoc & "'"
  87.    Else
  88.        FirstHalfSQL = FirstHalfSQL & ",[Doc]"
  89.        SecondHalfSQL = SecondHalfSQL & ",'" & varDoc & "'"
  90.    End If
  91. End If
  92. varRuta = request("Ruta")
  93. If varRuta <> "" then
  94.    iFieldCount = iFieldCount + 1
  95.    varRuta = Replace(varRuta, "'", "''")
  96.    If iFieldCount = 1 Then
  97.        FirstHalfSQL = FirstHalfSQL & "[Ruta]"
  98.        SecondHalfSQL = SecondHalfSQL & "'" & varRuta & "'"
  99.    Else
  100.        FirstHalfSQL = FirstHalfSQL & ",[Ruta]"
  101.        SecondHalfSQL = SecondHalfSQL & ",'" & varRuta & "'"
  102.    End If
  103. End If
  104. varidSolicitud = request("idSolicitud")
  105. If varidSolicitud <> "" then
  106.    iFieldCount = iFieldCount + 1
  107.    On Error Resume Next
  108.    varidSolicitud = CDbl(varidSolicitud)
  109.    If Err.Number = 13 Then
  110.        response.redirect (varLinkInv & "Solicitud")
  111.    End If
  112.    Err.Clear
  113.    On Error GoTo 0
  114.    If iFieldCount = 1 Then
  115.        FirstHalfSQL = FirstHalfSQL & "[idSolicitud]"
  116.        SecondHalfSQL = SecondHalfSQL & varidSolicitud
  117.    Else
  118.        FirstHalfSQL = FirstHalfSQL & ",[idSolicitud]"
  119.        SecondHalfSQL = SecondHalfSQL & "," & varidSolicitud
  120.    End If
  121. End If
  122.  
  123. adoRS.ActiveConnection = AdoConnection
  124. SQLInsert = FirstHalfSQL & SecondHalfSQL & EndSQL
  125.  
  126.         If SQLInsert <> sDefault Then
  127.             On Error Resume Next
  128.             call adoRS.Open(SQLInsert)
  129.             If err.number = -2147467259 then
  130.             response.redirect(varLinkDup)
  131.             end if
  132.             On Error Goto 0
  133.         else
  134.             response.redirect(varLinkND)
  135.         end if
  136.  
  137.     Response.redirect(varLink) %>
  #8 (permalink)  
Antiguo 06/10/2009, 09:03
 
Fecha de Ingreso: agosto-2009
Mensajes: 101
Antigüedad: 14 años, 8 meses
Puntos: 0
Respuesta: subir un archivo usando AJAX

Lo planteo de otra forma:
Imaginaos que en lugar de

<input type="file" id="doc" name="Doc" size="75" value="<%=vDoc%>">

fuera así:
<input type="text" id="doc" name="Doc" size="75" value="<%=vDoc%>">

Lo que introduzco en ese texto es la "ruta" del fichero que quiero Subir al servidor!

¿Como puedo hacerlo?
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.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:35.