在掩码输入素数面中使用自动完成答案

【问题标题】：Use autocomplete in masked-input primefaces在掩码输入素数面中使用自动完成
【发布时间】：2013-05-23 14:30:02
【问题描述】：

我想制作一个带有自动完成功能的屏蔽输入字段。在我的示例中，我有一个带有文章编号_.___.___ 的字段。我还有一个常用文章的列表。用户可以从列表中选择现有的文章编号，也可以添加新的文章编号。

如何组合这两个 primefaces 组件？

感谢您的帮助

乐宝

【问题讨论】：

标签： jsf-2 primefaces autocomplete maskedtextbox

【解决方案1】：

要实现这一点，您有两种可能性：创建自定义组件或通过 jQuery 手动设置输入掩码。我以这种方式实现了第二种方法：

使用普通的自动完成小部件

<h:form id="myPanel">
  <p:autoComplete id="number" value="#{myBean.number}" completeMethod="#{myBean.complete}" />
</h:form>

通过这个小 Javascript 激活 Inputmask

<script>
//<![CDATA[
$(document).ready(function() {
    $(':input[id="myPanel:number_input"]').inputmask("mask", {"mask": "(999) 999-9999"});
});
//]]>
</script>

(3. 确保你已经包含了 inputmask jquery 库:)

    <script src="jquery.inputmask.js" type="text/javascript"/>

虽然这个解决方案做了它应该做的事情，但我认为自定义组件会是更清洁的方式。无论如何，希望我的代码片段对您有所帮助。

【讨论】：

它在正常的 h:inputtext 中工作，但不幸的是在 p:autoComplete 中没有。感谢您的帮助，但您知道它可能是什么吗？
注意在您的 html 页面中生成的确切 ID。可能您必须像这样在javascript中将_input添加到您的id中： $(':input[id="myPanel:number_input"]').inputmask("mask", {"mask": "(999) 999- 9999"});
在 Primefaces 中你已经在这里了t need to include jquery.inputmask.js because its。只需使用另一个函数： $(':input[id="number_input"]').mask("999-99-99", "");