1

Estoy intentando realizar la conexión de Front-end con el Back-end mediante JSF. Estoy utilizando bootstrap, todo funciona perfecto hasta que inserto el jsf:action #{action} en el boton.

EL problema es que después de meter este pequeño fragmento de código el html no carga como se debe.

Agrego el código:

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
                xmlns:h="http://xmlns.jcp.org/jsf/html"
                xmlns:jsf="http://xmlns.jcp.org/jsf">

    <!-- BEGIN # MODAL LOGIN -->
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header" align="center">
                <img class="img-resize" id="img_logo" src="../resources/images/Icons/logo.png"/>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
                </button>
            </div>

            <!-- Begin # DIV Form -->
            <div id="div-forms">

                <!-- Begin # Login Form -->
                <form id="login-form" jsf:id="form">
                    <div class="modal-body">
                        <div id="div-login-msg">
                            <div id="icon-login-msg" class="glyphicon glyphicon-chevron-right"></div>
                            <span id="text-login-msg">#{msg.Login_GetData}</span>
                        </div>
                        <input class="form-control" placeholder="#{msg.Login_parmIdUsuario}" required="true" type="text" jsf:value="#{mpersonasnjControllerExc.parmIdUsuario}"/>
                        <input class="form-control" type="password" placeholder="#{msg.Login_parmCodClaveNivel1}" required="true" jsf:value="#{mpersonasnjControllerExc.parmCodClaveNivel1}"/>
                        <div class="checkbox">
                            <label>
                                <input type="checkbox"/> #{msg.Login_Remember}
                            </label>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <div>
                            <button type="Submit" jsf:action="#{mpersonasnjControllerExc.IniciaSesion}" class="btn btn-primary btn-lg btn-block">#{msg.LoginBtnIngresar}</button>
                        </div>
                        <div>
                            <button id="login_lost_btn" type="button" class="btn btn-link">#{msg.Login_OlvidoPassw}</button>
                            <a id="login_register_btn" type="button" href="/ClubExc/faces/cristyanp/musuarios/Create.xhtml?faces-redirect=true" class="btn btn-link">#{msg.CaratulaPortalRegistrarse}</a>
                        </div>
                    </div>
                </form>
                <!-- End # Login Form -->

                <!-- Begin | Lost Password Form -->
                <form id="lost-form" style="display:none;">
                    <div class="modal-body">
                        <div id="div-lost-msg">
                            <div id="icon-lost-msg" class="glyphicon glyphicon-chevron-right"></div>
                            <span id="text-lost-msg">Type your e-mail.</span>
                        </div>
                        <input id="lost_email" class="form-control" type="text" placeholder="E-Mail (type ERROR for error effect)" required="true"/>
                    </div>
                    <div class="modal-footer">
                        <div>
                            <button type="submit" class="btn btn-primary btn-lg btn-block">Send</button>
                        </div>
                        <div>
                            <button id="lost_login_btn" type="button" class="btn btn-link">Log In</button>
                            <button id="lost_register_btn" type="button" class="btn btn-link">Register</button>
                        </div>
                    </div>
                </form>
                <!-- End | Lost Password Form -->

                <!-- Begin | Register Form -->
                <form id="register-form" style="display:none;">
                    <div class="modal-body">
                        <div id="div-register-msg">
                            <div id="icon-register-msg" class="glyphicon glyphicon-chevron-right"></div>
                            <span id="text-register-msg">Register an account.</span>
                        </div>
                        <input id="register_username" class="form-control" type="text" placeholder="Username (type ERROR for error effect)" required="true"/>
                        <input id="register_email" class="form-control" type="text" placeholder="E-Mail" required="true"/>
                        <input id="register_password" class="form-control" type="password" placeholder="Password" required="true"/>
                    </div>
                    <div class="modal-footer">
                        <div>
                            <button type="submit" class="btn btn-primary btn-lg btn-block">Register</button>
                        </div>
                        <div>
                            <button id="register_login_btn" type="button" class="btn btn-link">Log In</button>
                            <button id="register_lost_btn" type="button" class="btn btn-link">Lost Password?</button>
                        </div>
                    </div>
                </form>
                <!-- End | Register Form -->

            </div>
            <!-- End # DIV Form -->

        </div>
    </div>
    <!-- END # MODAL LOGIN -->
</ui:composition>

Adjunto imagen de como se ve cuando inserto el fragmento mencionado:

No renderiza nada

1
  • Bienvenido al sitio @Cristian. Por favor indica cuál es el botón al que le agregas dicha característica y "malogra" el renderizado de la vista.
    – user227
    Commented el 19 abr. 2016 a las 19:46

1 respuesta 1

0

En JSF <h:commandButton /> lo que hace es generar un <button type="submit" /> por lo que debería funcionar:

<button type="submit" 
        jsf:action="#{mpersonasnjControllerExc.IniciaSesion}" 
        class="btn btn-primary btn-lg btn-block">
                         #{msg.LoginBtnIngresar}
</button>

Sin embargo debe haber algún stacktrace o warning en tal caso que no funcione.

Yo personalmente utilizo bootstrap directamente en los componentes, para eso está styleClass:

<h:commandButton styleClass="btn btn-primary btn-lg btn-block" 
                 action="#{mpersonasnjControllerExc.IniciaSesion}" 
                 value="#{msg.LoginBtnIngresar}"/>

Normalmente jsf:atributo se utiliza cuando no existe un componente JSF pero sí HTML5 como <video ...>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.