当显示时,如何在p:对话框中设置焦点在inputText上

时间:2014-03-13 19:22:54

标签: jsf primefaces

我希望焦点在第二个inputText上,只有当第一个inputText在显示p:对话框时不为空时,我试过这个但是我试过这个但是没有用......

        <p:dialog   showEffect="fade" appendToBody="true" onShow="cambioFoco();"  modal="false"  header="Change Password" width="450" height="300" widgetVar="dlgC">
            <h:form id="formCambio" >
                <p:panel id="panelMessages1" style="width:95%; height: 50px; margin: 0 auto;" widgetVar="aaa">
                    <p:messages for="messages1" id="messages1" severity="warn,error" showDetail="true" autoUpdate="true" showSummary="false"  closable="true" /> 
                    <p:growl for="messages2" severity="info" globalOnly="true" id="msgCorrecto" showDetail="true" sticky="false" life="2500" />
                </p:panel>


                <h:panelGrid  id="panelCambio" columns="3"  style="margin-top: 30px;margin-left: 40px; text-align: right; position: relative">
                    <p:outputLabel value="CCT:"/>
                    <p:inputText  id="txtcCct" value="#{login.cct}" required="true" validatorMessage="*CCT: 10 Caracteres" requiredMessage="*CCT: Valor requerido" maxlength="10" binding="#{cambioCController.cctfield}" style="text-transform: uppercase;">       
                        <f:validateLength minimum="10"/>
                    </p:inputText>    
                    <h:outputText value=""/>  

                    <p:outputLabel value="Password"  />
                    <p:password id="txtCPass"  required="true"  requiredMessage="*PASSWORD: Valor requerido"  maxlength="13" binding="#{cambioCController.passfield}" />
                    <h:outputText value=""/>                    

                    <p:outputLabel value="Nuevo Password" style="font-weight: bold" />
                    <p:password id="txtNPass" required="true"  requiredMessage="*NUEVO PASSWORD: Valor requerido" validatorMessage="*PASSWORD Solo letras y numeros, minimo 6 caracteres" maxlength="13" binding="#{cambioCController.newpassfield}" widgetVar="hola">
                        <f:validateRegex pattern="^([0-9A-Za-z]{5,13})$" />
                    </p:password>
                    <h:outputText value=""/>

                    <p:outputLabel value="Confirmar Password" style="font-weight: bold" />
                    <p:password id="txtCNPass" required="true"  requiredMessage="*CONFIRMACIÓN: Valor requerido" maxlength="13" binding="#{cambioCController.confirmpassfield}">
                        <f:validator validatorId="custom.cmpNewPassConfPass" /> 
                    </p:password>
                    <h:outputText value=""/>

                    <p:outputLabel/>
                    <p:commandButton value="Aceptar" validateClient="true" actionListener="#{cambioCController.cambio()}" onclick="resetPass();" update="panelMessages1" icon="ui-icon-check" style="text-align: right"/>
                </h:panelGrid>

            </h:form>
        </p:dialog>


        <h:form id="formLogin" >

            <p:panel id="panelMessages2"  style="width:100%; height: 50px; margin-bottom: 57px !important; " widgetVar="error">     
                <p:messages id="messages3" severity="error" showDetail="true" showSummary="false" autoUpdate="true" closable="true" globalOnly="false" /> 
            </p:panel>

            <p:panelGrid columns="1" style="margin: auto auto">
                <p:outputLabel value="Acceso" style="margin-left: 45%"/>
                <p:inputText id="txtCct" required="true" maxlength="10" validatorMessage="*CCT No valido" requiredMessage="*CCT Requerido" value="#{login.cct}"   binding="#{loginController.cctfield}" placeholder="CCT" style="width: 70%; float: right;text-transform: uppercase;" >
                    <f:validateRegex pattern="21[a-zA-Z]{3}[0-9]{4}[a-zA-Z]$" />  
                </p:inputText>

                <p:password id="txtPass" required="true" requiredMessage="*PASSWORD Requerido" maxlength="13"  binding="#{loginController.passfield}"  placeholder="PASSWORD" style="width: 70%;margin: 0 auto; float: right" />
                <p:commandButton  value="Entrar" validateClient="true" action="#{loginController.login}"  onclick="resetear();"  update="panelMessages2, @form :formCambio" style="float: right; font-size: 15px" icon="ui-icon-key"/>
            </p:panelGrid>
        </h:form>

这是我的java代码,这里我展示了p:dialog:

    public String login() {

        FacesContext facesContext = FacesContext.getCurrentInstance();
        RequestContext rContext = RequestContext.getCurrentInstance();

        if (p.equals(lb.getLogin(c))) {

                 //Do something 
            if (c.equals(p)) {

                rContext.execute("PF(dlgC.show());");

                facesContext.addMessage("messages1", new FacesMessage(FacesMessage.SEVERITY_WARN, "", "Change your password"));

                return null;
            } else {

                return "success";
            }
        } else {
            facesContext.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_ERROR, "ERROR ", "CCT or Password incorrect"));

            return null;
        }

    }

这是我的javascript

function cambioFoco(){

    var cct = document.getElementById("formCambio:txtcCct").value;

    if(cct.length > 0){
        document.getElementById("formCambio:txtCPass").focus();
    }

}

提前致谢!...

1 个答案:

答案 0 :(得分:0)

您需要将代码放入setTimeout调用(延迟为1),这将强制您的代码在下一次中断期间执行。

所以你的onshow将被修改为

onShow="setTimeout('cambioFoco()',1);"

您还可以改善您的javascript功能,如下所示

function cambioFoco(){    
    if($("#formCambio\\:txtcCct").val().trim()!=''){
         $("#formCambio\\:txtCPass").focus();
    }    
}