Greybox ¿Como abrir una ventana dentro de otra ventana?

[pippin]

Hola, de nuevo yo por aqui, no vendria si no necesitara de su ayuda... alguien ha usado Graybox, (es muy bueno) para abrir ventanas tipo modal... Lo que no he logrado es que una vez abierta una ventana (con el efecto greybox), abrir otra tambien con el efecto greybox, es decir si he logrado abrirla pero el contenido no carga...
 
He estado leyendo las FAQ y la documentacion pero no logro conseguirlo, si alguien me puede ayudar con esto lo agradeceria.
 
http://orangoo.com/labs/GreyBox/FAQ/#q12

[G1r3D]

Hey viejo solo como critica constructiva -creo yo- deberias modificar el titulo, ahi dice VENTA (de vender); para evitar confusiones.

[pippin]

Ok, disculpen mi afan... ya lo corregi.

[JaiMe]

No he usado Graybox, pero según veo solo podes tener una ventana abierta. Esto es por que el script crea un elemento con id GB_overlay y lo usa internamente, por eso cuando tenes dos elementos con el mismo id, el script te produce bugs como el que comentas.

Yo evitaria el abrir mas ventanas modales desde otra ventana por razones de usabilidad y experiencia de usuario. Pero, si queres hacerlo, revisa jQuery UI y el widget dialog, este de da mas control.

Podes crear el siguiente markup

Código: [Seleccionar]

<div id = "content"> <button>Abrir ventana1</button></div>
<div id = "ventana1"> <button>Abrir ventana2</button></div>
<div id = "ventana2"> Hola! </div>

Con el siguiente CSS

Código: [Seleccionar]

#ventana1, #ventana2 { display: none; }

Y agregas un poco de JavaScript

Código: [Seleccionar]

$('#content button').on('click', function(){
    $( "#ventana1" ).dialog({
            height: 140,
            modal: true
     });
});

$('#ventana1 button').on('click', function(){
    $( "#ventana2" ).dialog({
            height: 140,
            modal: true
     });
});

Solo tendrías que cambiar la posición de la segunda ventana, para mas info revisate la documentación de jQuery UI.

Te puse un pequeño ejemplo aqui: http://jsfiddle.net/LFRcL/1/

[pippin]

Gracias JaiMe tu como siempre ayudandome, y de verdad te lo agradesco... Tienes razon tal vez no es buena idea lo de dos ventanas modales... pero esta vez lo necesito, ya luego te dejo ver para que es (Apenas consiga un servidor con postgres)

Lo de jQuery Dialog ya lo habia visto, pero la verdad no lo habia aplicado porque al parecer (o al menos no encontre como) toca meter el codigo de la venta modal en la misma pagina desde donde se va a abrir, en este sitio, se muestra como hacer para abrir un archivo externo con jQuery Ui Dialog, pero no pude hacerlo funcionar  http://www.awven.com/q119-tips-jquery-ventana-modal/

Existe la forma de cargar un archivo externo en jQuery UI Dialog

Gracias.

[JaiMe]

El código de esa pagina tiene un curly bracket extra, por eso da error.

Para cargar contenido externo en una ventana solo llama el metodo load de jQuery, por ejemplo para la segunda ventana

Código: [Seleccionar]

$('#ventana1 button').on('click', function(){
    $( "#ventana2" ).dialog({
            height: 140,
            modal: true
    })
    .text('cargando......')
    .load('URL_AQUI');     
});



Ejemplo actualizado: http://jsfiddle.net/LFRcL/5/

[pippin]

Ok, JaiMe muchas gracias por tu ayuda, he puesto el ejemplo en marcha cambiando el on('click') por live('click') ya que con on no funciono, he cargado un archivo externo, efectivamente este cargo, pero resulta que si en este archivo cargado lo que hay es un formulario que lleva a otra pagina pues esta ultima no se abre sobre el Dialog UI se abre en una neuva pestaña del navegador, y esto pues no me sirve, intente cargar un archivo PDF en este jQuery UI Dialog y mosotro nada mas que simbolos raros.

Agradesco mucho tu ayuda JaiMe, nuevamente gracias.