mostrar modal al abrir

29 views
Skip to first unread message

Jose Puertas

unread,
Mar 24, 2016, 2:21:58 PM3/24/16
to ZnetDK
Hola pascal,  tengo un cuadro de dialogo modal el cual quiero abrir cuando llamo al archivo *.php tengo el siguiente codigo

<div id="znetdk_user_dialog" class="zdk-modal" title="<?php echo LC_FORM_TITLE_USER_NEW; ?>" data-zdk-width="694px">
    <form class="zdk-form" autocomplete="off"
          data-zdkerrmsg-required="<?php echo LC_MSG_ERR_MISSING_VALUE; ?>"
          data-zdk-action="users:save" data-zdk-datatable="znetdk_users_datatable">
.....


y lo llamo desde un js de inicio ubicado en public/js

$('#znetdk_user_dialog').zdkmodal('show');

no me funciona, a ver si me puedes ayudar.

Saludos

Pascal Martinez

unread,
Mar 26, 2016, 5:30:38 AM3/26/16
to ZnetDK
Hola José,

Alli esta un ejemplo de codigo que puedes anadir a tu archivo Javascript para abrir automaticamente, cada vez que  se muestra la vista PHP 'users', el cuadro de dialogo 'Nuevo usuario'.

$(document).ready(function() {
    var userViewName = 'users', userDialogId = '#znetdk_user_dialog';
    // Case of the 'office' layout
    $(document).on('zdkofficemenuaftershowview', function(event, viewInfos) {
        if (viewInfos.menuItem === userViewName) {
            $(userDialogId).zdkmodal('show');
        }
    });
    // Case of the 'classic' layout
    $(document).on("L2menuTabChange", function(event) { // Level 2
        if (event.menuId === 'menu-' + userViewName) {
            //alert('Change - Level 2: ' + event.menuId);
            $(userDialogId).zdkmodal('show');
        }
    }).on("L2menuViewLoad", function(event) { // Level 2
        if (event.menuId === 'menu-' + userViewName) {
            //alert('Load - Level 2: ' + event.menuId);
            $(userDialogId).zdkmodal().zdkmodal('show');
        }
    });
});

Este ejemplo functiona a la vez para los modelos de paginas 'classic' y 'office'.

Saludos,

Pascal MARTINEZ

Jose Puertas

unread,
Mar 29, 2016, 6:19:40 AM3/29/16
to ZnetDK
Hola Pascal la llamada al archivo php la hago de la siguiente forma:


el fuente de la vista es el siguiente:

<div id="znetdk_user_dialog" class="zdk-modal" title="<?php echo LC_FORM_TITLE_USER_NEW; ?>" data-zdk-width="694px">
    <form class="zdk-form" autocomplete="off"
          data-zdkerrmsg-required="<?php echo LC_MSG_ERR_MISSING_VALUE; ?>"
          data-zdk-action="users:save" data-zdk-datatable="znetdk_users_datatable">
        <!-- User ID -->
        <input class="zdk-row-id" type="hidden" name="user_id">
        <!-- Identity -->
        <fieldset>
            <legend><?php echo LC_FORM_FLD_USER_IDENTITY; ?></legend>
            <!-- User name -->
            <label><?php echo LC_FORM_LBL_USER_NAME; ?></label>
            <input type="text" name="user_name" maxlength="100" required >
            <!-- Email -->
            <label><?php echo LC_FORM_LBL_USER_EMAIL; ?></label>
            <input type="email" name="user_email" required 
                   data-zdkerrmsg-type="<?php echo LC_MSG_ERR_EMAIL_INVALID; ?>">
        </fieldset>
        <fieldset> <!-- Connection -->
            <legend><?php echo LC_FORM_FLD_USER_CONNECTION; ?></legend>
            <!-- Login ID -->
            <label><?php echo LC_FORM_LBL_LOGIN_ID; ?></label>
            <input type="text" name="login_name" autocomplete="off" value="" maxlength="20" required >
            <!-- Password -->
            <label><?php echo LC_FORM_LBL_PASSWORD; ?></label>
            <input type="password" name="login_password" autocomplete="off" value="" maxlength="20" required >
            <!-- Password confirmation -->
            <label><?php echo LC_FORM_LBL_PASSWORD_CONFIRM; ?></label>
            <input type="password" name="login_password2" autocomplete="off" value="" maxlength="20" required >
            <!-- Expiration date 
            <label><?php echo LC_FORM_LBL_USER_EXPIRATION_DATE; ?></label>
            <input type="date" name="expiration_date" required
                data-zdkerrmsg-date="<?php echo LC_MSG_ERR_DATE_INVALID; ?>">-->
        </fieldset>
        <fieldset> <!-- User rights -->
            <legend><?php echo LC_FORM_FLD_USER_RIGHTS; ?></legend>
            <!-- Status 
            <label><?php echo LC_FORM_LBL_USER_STATUS; ?></label>
            <div class="zdk-radiobuttongroup" data-name="user_enabled">
                <input type="radio" value="1"/>
                <label><?php echo LC_FORM_LBL_USER_STATUS_ENABLED; ?></label>
                <input type="radio" value="0"/>
                <label><?php echo LC_FORM_LBL_USER_STATUS_DISABLED; ?></label>
            </div>-->
            <!-- Menu access 
            <label><?php echo LC_FORM_LBL_USER_MENU_ACCESS; ?></label>
            <input type="checkbox" name="full_menu_access" value="1"/>
            <span><?php echo LC_FORM_LBL_USER_MENU_ACCESS_FULL; ?></span> -->
            <!-- Profiles 
            <label title="<?php echo LC_MSG_INF_SELECT_LIST_ITEM; ?>"><?php echo LC_FORM_LBL_USER_PROFILES; ?></label>
            <select class="zdk-listbox" name="profiles[]" multiple="multiple"
                    data-zdk-action="users:profiles"></select>-->
        </fieldset>
        <!-- Form buttons -->
        <button class="zdk-bt-save zdk-close-dialog" type="submit"><?php echo LC_BTN_SAVE; ?></button>
        <button class="zdk-bt-cancel zdk-close-dialog" type="button"><?php echo LC_BTN_CANCEL; ?></button>
    </form>
</div>

y en el archivo ubicado en el public/js de la aplicacion registro he insertado el codigo que me adjuntas, pero no abre automaticamente el dialogo, he de decirte que en el menu sólamente existe la vista users por si radicara ahi el problema.

Saludos

Pascal Martinez

unread,
Mar 29, 2016, 3:17:04 PM3/29/16
to ZnetDK
Hola José,

Comprueba si tu archivo Javascript esta correctamente declarado en tu script ../app/config.php.
Por ejemplo, si se llama mi_archivo.js, tienes que añadir la linea siguiente:

define('CFG_APP_JS','applications/' . ZNETDK_APP_NAME . '/public/js/mi_archivo.js');

Sino, utiliza las funciones de depuración de tu navegador para ejecutar el código Javascript paso a paso e identificar el problema.

Saludos,

Pascal MARTINEZ

Jose Puertas

unread,
Mar 29, 2016, 5:24:35 PM3/29/16
to ZnetDK
Hola Pascal, la linea que me indicas está bien, y en el script en la depuración me salta de la linea 1 a la 2 y vuelve a la 1 y sale por el 5 sin pasar por el 3 ni el 4.

$(document).ready(function() {
    var userViewName = 'regusuarios', userDialogId = '#znetdk_user_dialog';
    // Case of the 'office' layout
    $(document).on('zdkofficemenuaftershowview', function(event, viewInfos) {
        if (viewInfos.menuItem === userViewName) {
            $(userDialogId).zdkmodal('show');
        }
    });
    // Case of the 'classic' layout
 $(document).on("L2menuTabChange", function(event) { // Level 2 linea 1
        if (event.menuId === 'menu-' + userViewName) { //linea 3
            //alert('Change - Level 2: ' + event.menuId);
            $(userDialogId).zdkmodal('show');
        }
    }).on("L2menuViewLoad", function(event) { // Level 2 linea 2
        if (event.menuId === 'menu-' + userViewName) { linea 4
            //alert('Load - Level 2: ' + event.menuId);
            $(userDialogId).zdkmodal().zdkmodal('show');
        }
    }); linea 5
});

saludos

Jose Puertas

unread,
Apr 1, 2016, 5:41:51 AM4/1/16
to ZnetDK
Hola Pascal, si me pudieras indicar qué eventos harian entrar en los apartados para mostrar el modal, ya que no hay ni pestañas ni botones, únicamente es cuando el formulario *.php es llamado.

Saludos 

Jose Puertas

unread,
Apr 1, 2016, 6:14:21 AM4/1/16
to ZnetDK
He modificado el fuente del javascript para que inicie directamente:

 $(document).ready(function() {
 userDialogId = '#znetdk_user_dialog';
   
            $(userDialogId).zdkmodal('show');
       
    });

y sólamente funciona si entro en modo depuración y ejecuto las instrucciones, si no se hace asi, no muestra el formulario.

Saludos

Pascal Martinez

unread,
Apr 2, 2016, 4:23:38 PM4/2/16
to ZnetDK
Hola José,

Con el modelo de pagina 'classic', si tu aplicación tiene únicamente la vista 'users', el código fuente siguiente tendría que funcionar :

$(document).ready(function() {
   
var userViewName = 'users', userDialogId = '#znetdk_user_dialog';
   
// Case of the 'classic' layout
    $
(document).on("L1menuViewLoad", function(event) { // Level 1

       
if (event.menuId === 'menu-' + userViewName) {

            $
(userDialogId).zdkmodal().zdkmodal('show');
       
}
   
});
});

Saludos,

Pascal MARTINEZ

Jose Puertas

unread,
Apr 10, 2016, 5:00:21 AM4/10/16
to ZnetDK
Muchas gracias Pascal, me es de mucha utilidad , no sabia como estaban configurados los niveles, ahora me hago una idea, por otra parte podria utilizar el modo en que tu validas los datos de los usuarios, y si es asi, puedes decirme cómo puedo descartar o incluir los parámetros que serian obligatorios o no ?

Saludos

Pascal Martinez

unread,
Apr 16, 2016, 3:22:45 AM4/16/16
to ZnetDK
Hola José,

En un formulario HTML de tu vista ZnetDK, tienes que añadir la propriedad required a un campo de typo <input> por ejemplo, para que vuelve obligatorio.

Puedes consultar en la demostración de ZnetDK, la página Demo FORM si quieres unos ejemplos de implementación.

Saludos,

Pascal MARTINEZ
Reply all
Reply to author
Forward
0 new messages