Foros del Web » Programando para Internet » Javascript »

Refrescar capa

Estas en el tema de Refrescar capa en el foro de Javascript en Foros del Web. Tengo un problema, me ayudan por favor Tengo una capa que abro y cierro con dos botones diferentes a traves de funciones. Cuando envio el ...
  #1 (permalink)  
Antiguo 05/09/2012, 15:08
 
Fecha de Ingreso: noviembre-2010
Mensajes: 204
Antigüedad: 13 años, 5 meses
Puntos: 1
Refrescar capa

Tengo un problema, me ayudan por favor

Tengo una capa que abro y cierro con dos botones diferentes a traves de funciones.

Cuando envio el fomulario que cargo en la capa, sale un mensaje que dice "MENSAJE ENVIADO". Luego yo cierro la capa con un boton. Hasta aqui funciona bien.

El problema es que si vuelvo a abrir la capa para llenar un nuevo formulario, me sigue saliendo el mensaje "MENSAJE ENVIADO" y no el fomulario para llenarlo nuevamente.

¿Como refresco la capa cada vez que oprimo el boton para cargar el formulario?

Coloco parte del codigo

Código HTML:
Ver original
  1. <script type="text/javascript">
  2.  
  3. function mostrarcontacto()
  4. {
  5.     var ventana = document.getElementById('contacto');
  6.     ventana.style.marginTop = "10px";
  7.     ventana.style.marginLeft = ((document.body.clientWidth-540) / 2) +  "px";
  8.     ventana.style.display = 'block';
  9. }
  10.  
  11. function ocultarcontacto()
  12. {
  13.     var ventana = document.getElementById('contacto');
  14.     ventana.style.display = 'none';
  15. }
  16.  
  17.  
  18. .
  19. .
  20. .
  21. .
  22.  
  23. <a href="javascript:mostrarcontacto();">Contactenos</a>
  24. <br>
  25. <br>
  26. <br>
  27.  
  28. <div id="contacto" width: 550px; height: 530px; display:none;">
  29.  <div>Contactenos</div>
  30.  
  31.  <div id="enviocorreo2">
  32.   <?php include('formulario01.php')?>
  33.  </div>
  34.  
  35.  <div><input onclick="ocultarcontacto();"/></div>
  36. </div>

Gracias

Isabel
  #2 (permalink)  
Antiguo 05/09/2012, 15:16
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 15 años, 10 meses
Puntos: 220
Respuesta: Refrescar capa

pero parece que el error esta en tu PHP específicamente aquí

<?php include('formulario01.php')?>
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #3 (permalink)  
Antiguo 05/09/2012, 15:23
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: Refrescar capa

para refrescar una capa has de usar ajax y no viene al caso. el código javascript lo que hace es mostrar y ocultar la capa. y php es el que se encarga de modificar el dom. por lo tanto la solución, sea la que sea, pasa por usar php
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}
  #4 (permalink)  
Antiguo 05/09/2012, 15:43
 
Fecha de Ingreso: noviembre-2010
Mensajes: 204
Antigüedad: 13 años, 5 meses
Puntos: 1
Respuesta: Refrescar capa

Cita:
Iniciado por Dradi7 Ver Mensaje
pero parece que el error esta en tu PHP específicamente aquí

<?php include('formulario01.php')?>

Dradi7, te refieres al ; que me falto colocar.


<?php include('formulario01.php');?>

Aun asi me sigue el problema .
  #5 (permalink)  
Antiguo 05/09/2012, 15:49
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 15 años, 10 meses
Puntos: 220
Respuesta: Refrescar capa

el problema esta como menciona IsaBelM que para poder mostrar el contenido dinamicamente debes poder usar ajax a menos que solamente el include muestre simplemente un formulario de lo contrario si ese incluido hace algun proceso seria conveniente el uso de Ajax
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #6 (permalink)  
Antiguo 05/09/2012, 16:58
 
Fecha de Ingreso: noviembre-2010
Mensajes: 204
Antigüedad: 13 años, 5 meses
Puntos: 1
Respuesta: Refrescar capa

Cita:
Iniciado por Dradi7 Ver Mensaje
el problema esta como menciona IsaBelM que para poder mostrar el contenido dinamicamente debes poder usar ajax a menos que solamente el include muestre simplemente un formulario de lo contrario si ese incluido hace algun proceso seria conveniente el uso de Ajax
Dradi7, Lo que tu dices es cierto.

Yo uso ajax para recargar y actualizar el <div id="enviocorreo2">, eso me funciona muy bien. Y cuando la capa se abre por primera vez uso <?php include('formulario01.php')?> se carga muy bien.

El problema es que si vuelvo a abrir la capa para llenar un nuevo formulario, me sigue saliendo el mensaje "MENSAJE ENVIADO" del ultimo envio y no el fomulario para llenarlo nuevamente.

La unica forma de que o me salga es cargando toda la pagina nuevamente.
  #7 (permalink)  
Antiguo 05/09/2012, 17:23
 
Fecha de Ingreso: julio-2011
Mensajes: 220
Antigüedad: 12 años, 9 meses
Puntos: 72
Respuesta: Refrescar capa

La solución puede estar en el código que cambia el formulario por el texto MENSAJE ENVIADO, hay que hacer que despues de un tiempo vuelva a mostrar el formulario y no ese texto puede ser con setTimeout().

Última edición por lubtufano; 05/09/2012 a las 17:52
  #8 (permalink)  
Antiguo 05/09/2012, 17:54
 
Fecha de Ingreso: noviembre-2010
Mensajes: 204
Antigüedad: 13 años, 5 meses
Puntos: 1
Respuesta: Refrescar capa

Cita:
Iniciado por lubtufano Ver Mensaje
La solución puede estar en el código que cambia el formulario por el texto MENSAJE ENVIADO, hay que hacer que despues de un tiempo vuelva a mostrar el formulario y no ese texto puede ser con setTimeOut().
lubtufano,

Cuando el formulario se envia y aparece el mensaje "MENSAJE ENVIADO", existe un boton que cierra la capa en la que se carga el mensaje.
  #9 (permalink)  
Antiguo 05/09/2012, 18:00
 
Fecha de Ingreso: julio-2011
Mensajes: 220
Antigüedad: 12 años, 9 meses
Puntos: 72
Respuesta: Refrescar capa

Sí, eso está claro, pero los botones que muestran y ocultan la capa sólo hacen eso no creo que tengan algo que ver con el contenido de la capa, me parece que lo importante es el código del archivo 'formulario01.php'
  #10 (permalink)  
Antiguo 05/09/2012, 18:22
 
Fecha de Ingreso: noviembre-2010
Mensajes: 204
Antigüedad: 13 años, 5 meses
Puntos: 1
Respuesta: Refrescar capa

Cita:
Iniciado por lubtufano Ver Mensaje
Sí, eso está claro, pero los botones que muestran y ocultan la capa sólo hacen eso no creo que tengan algo que ver con el contenido de la capa, me parece que lo importante es el código del archivo 'formulario01.php'
lubtufano,

Reviso el formulario01.php pero no le veo nada fuera de lo normal.

Te pregunto, existe alguna forma de decirle a la capa, al abrirla que este limpia de cualquier cosa antes de utilizar la instruccion <?php include('formulario01.php');?>
  #11 (permalink)  
Antiguo 05/09/2012, 18:51
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.050
Antigüedad: 15 años
Puntos: 1485
Respuesta: Refrescar capa

buenas...
@isabelramirezmontoya, creo que estás mezclando entornos. el código php se interpreta en el servidor. el cliente no puede condicionar si se interpreta o no una porción en particular. si miras el código fuente desde el navegador, debes notar que por ningún lado encuentras código php. y aunque lo hubiera, el navegador tampoco sabría como interpretarlo... primero porque no es al navegador quien le corresponde y segundo porque el navegador no tiene un interprete php. en fin, el contenido del include siempre va estar presente a no ser que sea condicionado a traves de php.

hay varias formas que puedes hacer para mostrar un contenido u otro en un lugar particular desde el cliente. por ejemplo, puedes tener dos bloques: el formulario y el mensaje. el mensaje se mantiene oculto hasta que se realice el envio. al momento de enviar los datos, se oculta el formulario y luego se muestra el mensaje. en este proceso también puedes programar el botón de cerrar la capa al momento de ocurrir un evento. es decir, cuando se envia el formulario haces las siguientes tareas:
  1. enviar el formulario
  2. ocultar el formulario
  3. mostrar el mensaje
  4. y programar el botón de cerrar
la parte de programar el botón de cerrar básicamente es manipular el evento onclick. al enviarse el formulario agregas otro evento onclick para que además de cerrar la capa, también esconda el bloque de mensaje, muestre el formulario, y elimine el evento recientemente agregado. la próxima vez que el usuario solicite mostrar el formulario, debe ver el formulario y el botón cerrar debería funcionar normalmente. esta técnica también la puedes emplear con ajax para cargar el formulario. todo dependerá que opción quieras utilizar.

@edit
un ejemplo de lo anterior usando dos bloques.

Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!-- saved from url=(0014)about:internet -->
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Base, development and inspection.</title>
<script type="text/javascript">
function byID(id){ return document.getElementById(id); }

self.onload = function(){
    function restore_form(){
    form.reset();
    form.style.display = ""; message.style.display = "";
    close.removeEventListener("click", restore_form, false);
    }

var layer = byID("layer"), form = byID("form"), message = byID("message"), close = byID("close"), show = byID("show");
form.onsubmit = function(){ close.addEventListener("click", restore_form, false); form.style.display = "none"; message.style.display = "block"; return false; };
show.onclick = function(){ layer.style.display = "block"; };
close.onclick = function(){ layer.style.display = "";  };
};
</script>
<style type="text/css">
div#layer, p#message {
display: none;
}

div#layer {
border: thin solid black;
padding: .25em;
}
</style>
</head>

<body>
<button id="show">Show</button>
<div id="layer"><form id="form">Form <input value="Write something" name="name"><input type="submit" value="Send"></form>
<p id="message">Message</p><button id="close">Close</button></div>
</body></html>
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.

Última edición por zerokilled; 05/09/2012 a las 19:29 Razón: agregando código de ejemplo
  #12 (permalink)  
Antiguo 05/09/2012, 20:32
 
Fecha de Ingreso: noviembre-2010
Mensajes: 204
Antigüedad: 13 años, 5 meses
Puntos: 1
Respuesta: Refrescar capa

zerokilled,

Gracias, por el analisis y ejemplo que me sugieres.

Creo que lo mejor sera lo que me sugieres en el evento onclick(). Con ajax actualizar el id, para quitar el mensaje, cargar el formulario y cerrar la ventana.

Voy a probar.
  #13 (permalink)  
Antiguo 06/09/2012, 18:17
 
Fecha de Ingreso: noviembre-2010
Mensajes: 204
Antigüedad: 13 años, 5 meses
Puntos: 1
Respuesta: Refrescar capa

zerokilled,

Probe lo que me sugeriste y quedo perfecto .

Mil gracias

Quedo con una duda, cuando me recarga el formulario, las vocales tildadas o la ñ, no aparecen, lo que aparece es un figurita en forma de rombo. No se por que.

Etiquetas: formulario, funcion, input, php, refrescar, botones, capas
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 07:58.