Cómo incluir una vista dentro de un modal
Cómo incluir una vista dentro de un modal
En este artículo aprenderás a incluir una vista dentro de un modal de manera simple.
Un modal es una ventana emergente que se genera siempre cuando se ejecuta una vista, dentro del modal puedes incluis otra vista, debes considerar que esta vista siempre se ejecutara y que esto puede volver más lenta tu vista ya que utilizando el modal sólo estas ocultando una parte del código html, tambien considera que esta vista no se borra al cerrar el modal.
Creando el modal de manera simple
Para comenzar debe de incluir lo siguiente en la vista donde lo desee utilizar para incluir la librería correspondiente.
use yii\bootstrap\Modal;
Para agregar el modal puede agregar el siguiente código dentro de la misma vista.
Modal::begin([
'header' => '<h2>Hello world</h2>',
'toggleButton' => ['label' => 'click me'],
]);
echo 'Say hello...';
Modal::end();
Usted puede modificar algunas características al modal como el título del encabezado modificando la propiedad 'header' y para modificar las características del botón deberá de modificar las propiedades de 'toggleButton' , por ejemplo el titulo del botón.
Si observa hay dos veces que se utiliza el Widget 'Modal' en esa parte usted puede agregar todo el contenido que desee que se encapsule dentro del modal. Es importante recordar que el modal siempre es ejecutado cuando se muestra la vista, sólo que mediante JQuey y CSS se oculta y cuando se da clic en el botón se muestra el modal.
Esto hará aparecer un botón con el cual al darle clic se mostrará el modal de la siguiente manera.
La forma de cerrar este modal siempre será dando clic en la X en la parte superior derecha ó dando clic fuera del modal.
Agregar una vista al modal que ya existe
Una vez que ya comprendiste que es un modal y cómo funciona ahora puedes conbinar el uso del modal con render de la siguiente manera.
Paso 1. Crea una vista nueva.
Para crear una vista nueva solo entra a tu carpeta de tu vistas correspondientes y agregar un nuevo archivo PHP que se llame '_buscar' con el siguiente código.
<h1>Hola son una vista.</h1>
<p>Aqui puedes agregar cualquier elemento de Yii</p>
Paso 2. Agrega la inclusión de la vista al modal.
Ahora dentro de tu modal solo tendrás que agregar la siguiente línea que se muestra en negritas.
Modal::begin([
'header' => '<h2>Hello world</h2>',
'toggleButton' => ['label' => 'click me'],
]);
echo $this->render('_buscar', []);
Modal::end();
Donde '_buscar' es el nombre de la vista que has creado en el paso anterior.
Al dar clic en el botón deberá aparecer de la siguiente manera.
Puedes agregar cualquier vista no solo que esté dentro de la misma carpeta, también puedes incluir vistas que estén fuera de esa carpeta solo agregando la ruta correspondiente.
Referencias
Comentarios
Publicar un comentario