AJAX - Ajax y formularios

 
Vista:

Ajax y formularios

Publicado por Cucovic (1 intervención) el 28/08/2007 09:15:55
Hola,

estoy intentando pasar por Post un fichero .zip a un script php. En esto no tengo problema, consigo subir el fichero y ver su contenido con el php, pero mi problema es el siguiente:

La aplicación web donde lo estoy implementando, tiene una capa menú (div) y una capa contenido. Cuando selecciono alguna opción de menú, con ajax inserto en la capa contenido la opción de menú que me interesa, en el caso de la subida del fichero .zip, una capa con un formulario con el enctype="multipart/form-data".

El caso es que al darle al botón de enviar, me redirige a la página indicada en el action y sale de la aplicación para mostrarme en una página en blanco el resultado del script.

¿Como puedo hacer para que al darle a enviar el resultado de la ejecución del script aparezca en la capa contenido?. El código js que carga las capas es:

-------------------------------------------------------------------------
function cambiaPagina (url, id_contenedor) {
var pagina_requerida = false;
if (window.XMLHttpRequest) {
// Si es Mozilla, Safari etc
pagina_requerida = new XMLHttpRequest ();
} else if (window.ActiveXObject) {
// pero si es IE
try {
pagina_requerida = new ActiveXObject ("Msxml2.XMLHTTP");
} catch (e) {
// en caso que sea una versión antigua
try {
pagina_requerida = new ActiveXObject ("Microsoft.XMLHTTP");
} catch (e) {
}
}
} else
return false;

pagina_requerida.onreadystatechange = function () {
// función de respuesta
cargarPagina (pagina_requerida, id_contenedor);
}

pagina_requerida.open ('GET', url, true); // asignamos los métodos open y send
pagina_requerida.send (null);
}

// todo es correcto y ha llegado el momento de poner la información requerida
// en su sitio en la pagina xhtml
function cargarPagina (pagina_requerida, id_contenedor) {
if (pagina_requerida.readyState == 4 && (pagina_requerida.status == 200 || window.location.href.indexOf ("http") == - 1))
document.getElementById (id_contenedor).innerHTML = pagina_requerida.responseText;
}
-------------------------------------------------------------------------

El formulario:

-------------------------------------------------------------------------
<form action="php/zip.php" enctype="multipart/form-data" method="POST">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="40%">
Seleccione un fichero ZIP para enviar
</td>
<td width="60%">
<input type="file" name="fichero" />
</td>
</tr>
<tr height="5"><td width="100%" colspan="2"></td></tr>
<tr>
<td width="40%"></td>
<td width="60%">
<input type="submit" value="Enviar" />
</td>
</tr>
</table>
</form>
-------------------------------------------------------------------------

El php con el script de tratamiento del zip:

-------------------------------------------------------------------------
<?php
require("gestionBD.php");
$miConexion = new GestionBD;
$miConexion -> conectar ();
$zip = zip_open($_FILES["fichero"]["tmp_name"]);

if ($zip) {
while ($zip_entry = zip_read($zip)) {
if (zip_entry_open($zip, $zip_entry, "r")) {
$imagen = zip_entry_read($zip_entry, zip_entry_filesize($zip_entry));
$imagen = addslashes($imagen);
$nombre = zip_entry_name($zip_entry);
$tamanio = zip_entry_filesize($zip_entry);
$propietario = "null";
$ancho = 1024;
$alto = 768;
$descripcion = "null";
zip_entry_close($zip_entry);

$query = "INSERT INTO imagenes (nombre,tamanio,imagen,propietario,ancho,alto,descripcion) VALUES ('" . $nombre . "','" . $tamanio . "','" . $imagen . "','" . $propietario . "','" . $ancho . "','" . $alto . "','" . $descripcion . "')";
$miConexion -> ejecutaSQL ($query);
if ($miConexion -> Errno == 0) {
echo "La inserción se ha realizado correctamente <br>";
}
}
}
} else {
echo "No existe el fichero indicado";
}

zip_close($zip);
$miConexion -> desconectar ();
?>
-------------------------------------------------------------------------

Y mi index.php:

-------------------------------------------------------------------------
<html>
<head>
<title>Comunidad Pichincha</title>

<!-- HOJAS DE ESTILO -->
<link rel="stylesheet" href="css/estilos.css">
<link rel="stylesheet" href="css/menu.css">

<!-- FUNCIONES JS -->
<script language="JavaScript" src="js/prototype.js" type="text/javascript"></script>
<script language="JavaScript" src="js/funciones.js" type="text/javascript"></script>
<script language="JavaScript" src="js/menu_JS.js" type="text/javascript"></script>
<script language="JavaScript" src="js/menu_A.js" type="text/javascript"></script>
<script language="JavaScript" src="js/menu_B.js" type="text/javascript"></script>
<script language="JavaScript" src="js/menu_C.js" type="text/javascript"></script>
<script type="text/javascript">
var menu = null;
var elementosA = 0;
var elementosB = 0;
var elementosC = 0;
</script>
</head>

<body>
<!-- CAPA PRINCIPAL -->
<div id="capota">

<!-- CAPA LADO IZQUIERDO -->
<div id="capaLadoI"></div>

<!-- CAPA CENTRAL -->
<div id="capaCentro">

<!-- CAPA CABECERA -->
<div id="capaCab"></div>

<!-- CAPA CUERPO -->
<div id="capaCuerpo">

<!-- CAPA MENU -->
<div id="capaMenu">
<div id="cuerpo">
<?php include ("php/menu.php");?>
</div>
</div>

<!-- CAPA MOVER MENU -->
<div id="capaMover" onclick="mover();" class="txtEnlace"></div>

<!-- CAPA CONTENIDO WEB -->
<div id="capaContenido"></div>
</div>
</div>

<!-- CAPA LADO DERECHO -->
<div id="capaLadoD"></div>
</div>
</body>
</html>
-------------------------------------------------------------------------

Un saludo y muchas gracias.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder