Question

在hiperlink中单击FORM中的Edit信息后，我需要在InputText字段中显示掩码。第一次访问表单时，inputext字段会正确显示掩码。

遵循我的代码：

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.11/jquery.mask.min.js"></script>

    <label for="inputcpf">CPF</label>
    <h:inputText class="form-control" required="false" value="#{clienteBean.cliente.cpf}" id="inputcpf" requiredMessage="Informe o CPF do cliente." pl:placeholder="Informe o CPF" />        

    <script type="text/javascript">
      $("#inputcpf").mask("999.999.999-99");
    </script>

以及代码的EDIT部分：

    <p:column style="width:260px;" headerText="Nome" >
      <f:ajax event="click" execute="@this" render="@form" listener="#{clienteBean.preparaAlteracao}">
      <h:commandLink value="#{dados.nome}">
        <f:param name="id" value="#{dados.id}" /> 
      </h:commandLink>
      </f:ajax>                                                                                                 
    </p:column>

点击链接后，数据将被加载到字段中，但是带有掩码的字段不会显示掩码

Answer 1

一旦聚焦输入，就会显示遮罩。您可能会将输入嵌入到h:form中，如下所示：

<h:form id="myForm">
    <h:inputText ... id="inputcpf" .../>        
</h:form>

form id放在客户端html中呈现的input id之前：

<input id="myForm:inputcpf" ...>

因此，您的jQuery选择器应如下所示：

$("#myForm\\:inputcpf")

您可以在How can I know the id of a JSF component so I can use in Javascript中找到有关客户端ID的更多信息。如果您的客户ID不包含父表单的ID作为前缀（或其他任何NamingContainer），则您很可能正在使用prependId="false"，出于{ {3}}

但是，要获得屏蔽输入的最简单，最稳定的方法就是使用PrimeFaces组件UIForm with prependId="false" breaks <f:ajax render>。使用当前的方法，使用AJAX更新输入后，掩码就会丢失。您还必须更新script元素，以便再次执行mask函数，并在更新后的input上加上掩码。

Answer 2

我用素数代码更改了我的代码。跟随！

    <h:form id="form">
    <h:inputHidden value="#{userBean.user.id}" />
    <p:inputText required="true" value="#{userBean.user.name}" id="inputName" />
    <p:inputMask mask="(99)99999-9999" value="#{userBean.user.phone}" id="inputPhone" >
        <p:keyFilter regEx="/[a-z0-9_]/i"/>
    </p:inputMask>
    <p:commandButton value="Save" update="@form" process="@form" actionListener="#{userBean.saveUser}" />

我保存用户并刷新所有页面...新用户将插入数据表列表中。然后我有所有用户的dataTable ...

下一步，我需要单击“编辑”链接以编辑信息...，此刻数据已填充在字段中，但字段丢失了掩码在输入字段中。

    <p:dataTable id="list_users" var="dados" value="#{userBean.allUsers}">
    <p:column>
       <f:facet name="header">ID</f:facet> 
       <h:outputText value="#{dados.id}" />
    </p:column>
    <p:column>
       <f:facet name="header">Name</f:facet> 
       <h:outputText value="#{dados.name}" />
    </p:column>
    <p:column headerText="Ação">
      <f:facet name="header">Ação</f:facet> 
      <f:ajax event="click" render="@form" listener="#{userBean.editUser}">
        <h:commandLink>
          <f:param name="id" value="#{dados.id}" />                                                             
          <h:outputText value="edit" />
        </h:commandLink>
    </f:ajax>
    </p:column>
    </dataTable>

然后在编辑信息时Inputtext丢失了掩码，这是怎么回事？

2 个答案: