只接受 h:inputText 值的数字
Posted
技术标签:
【中文标题】只接受 h:inputText 值的数字【英文标题】：Accept only digits for h:inputText value 【发布时间】：2013-10-16 15:54:54 【问题描述】：有没有办法在 JSF 中确认 h:inputText 的值，它应该只接受数字。表示它可以是Integer 或float。
如果我输入 12s3a562.675 、 a5678s12 、 68712haf.563345 或任何其他此类值，那么它应该会显示错误。否则它接受并继续。
【问题讨论】：
【参考方案1】：<h:inputText onkeypress="if(event.which &lt; 48 || event.which &gt; 57) return false;"/> 如果您只想接受整数，这是一种捷径。
它比type="number" 的优势在于你甚至不能输入非数字
【讨论】：
dasLort：我这边加一个。我应该怎么做才能只允许数字并输入密钥 @ShirgillAnsari 是这样的：onkeypress="if(event.which &lt; 48 || event.which &gt; 57) return false;else if(event.which === 13) myFunction()" 但我仍然更喜欢将所有内容放在一个单独的函数中
禁用 javascript 会不会绕过此验证？
@ChristopheWeis 它会，但是正如 BalusC 所说 [q] JSF 为那些将自动启动的类型内置了转换器。 [/q]【参考方案2】：
只需将输入值绑定到Double 或更好的BigDecimal 属性，而不是String。
private BigDecimal number; // Double can also, but beware floating-point-gui.de
<h:inputText value="#bean.number" />
JSF 有builtin converters 用于那些将自动启动的类型。您可以自定义转换器消息如下：
<h:inputText value="#bean.number" converterMessage="Please enter digits only." />
【讨论】：
【参考方案3】：如果你把它添加到你的 xhtml 中
xmlns:pe="http://primefaces.org/ui/extensions"
并将 inputext 用于称为 pe:inputNumber 的 Primefaces Extensions 数字，它不仅可以验证您的数字，还可以验证小数，可能更完整。
<pe:inputNumber value="#beanTest.myValue" thousandSeparator="" decimalSeparator="." decimalPlaces="0" />
【讨论】：
我尝试将扩展库添加到我的项目并使用 InputNumber，但配置不正确。那么请您分享如何配置以使用扩展组件和 primefaces 组件。我目前在我的项目中使用 primefaces 5.2。 这现在是 PrimeFaces 的一部分。见primefaces.org/showcase/ui/input/inputNumber.xhtml【参考方案4】：如果您愿意使用 Primefaces，您可以将 <p:keyFilter> 附加到 <h:inputText> 或 <p:inputText>。
例子：
<h:inputText id="text1" value="#bean.intValue" />
<p:keyFilter for="text1" mask="pint" />
<p:inputText id="text2" value="#bean.numberValue" >
<p:keyFilter mask="num" />
</p:inputText>
这将阻止键盘输入以允许仅有效的整数 (int/pint) 或十进制 (num/pnum) 输入。 pnum 和 pint 类型只允许正输入（无符号）。
【讨论】：
【参考方案5】：试试
<h:inputText value="SomeValue" converter="javax.faces.Double" />
【讨论】：
这是错误的，因为“.123”通过了验证（以点开头）。我认为你应该使用 'double a = .123; 在 Java 中是 100% 有效的（为了测试它在 Java 代码中复制这一行）。 javax.faces.Double 是标准的 JSF 转换器，它涵盖了 Java double。【参考方案6】：
这对我有用
onkeypress="if( (event.which < 48 || event.which > 57) ) return false;"
【讨论】：
【参考方案7】：这里有一些不同的选项：
您可以从bean validation 使用@Digits。
您可以使用f:convertNumber。
您可以在支持 bean 方法中验证输入（您可以轻松找到相关教程）
如果你可以选择 jsf 2.2 和 html5，你可以使用<input type="number" />
或者您可以使用自己的 Javascript 验证。
我认为最好的选择是使用 Bean 验证、f:convertNumber 或使用 HTML5，因为这些是最干净的并且可以提供你的冗余代码最少。
【讨论】：
感谢您的回答。但是因为我有将近 30-40 个输入字段，所以 bean 验证不会是一个好方法。然后我尝试了 f:convertNumber with pattern/type/digitsOnly，但它没有抛出错误。那么，您是否建议任何其他简单的方法来检查它。 f:convertNumber 将接受以数字开头的输入并尝试猜测它应该是什么数字，因此 12f 将变为 12。它不会接受以非数字字符开头的输入。为什么 bean 验证不起作用？您只需要为与您的输入之一对应的支持 bean 中的每个字段放置一个注释。甚至比 f:convertNumber 少一点代码。@Digits 也要求输入只能是数字。【参考方案8】：
你可以使用 JS 验证
首先，你需要定义一个JS函数来验证输入
function validateInput(regexString)
var theEvent = window.event || event;
var key = theEvent.keyCode || theEvent.which;
if (key >= 46)
key = String.fromCharCode(key);
var regex = new RegExp("^" + regexString + "$");
if (!regex.test(key))
theEvent.returnValue = false;
if (theEvent.preventDefault)
theEvent.preventDefault();
其次，在您的 h:input 中，捕获 onKeyPress 事件并调用函数
<h:inputText value="..." onKeyPress="validateInput('[0-9]*')/>
而且它只会让你输入数字。
当您需要验证其他正则表达式时，您可以轻松将此用途扩展到其他情况。
注意，这仅适用于按键，如果您想捕获其他用户事件，请使用正确的标签。
干杯
【讨论】：
感谢您的回答。但是正如我所写的那样，我有 30-40 个输入值，直到 12 位（6.6），所以使用按键调用 javascript 代码一千次并不是一个好主意。您是否建议任何其他方法。 @abhi 这个 JS 对用户输入做出反应，用户不可能同时输入一千个数字。请更好地解释你的问题。干杯【参考方案9】：现在可以使用 PrimeFaces 扩展代替！
https://www.primefaces.org/showcase/ui/input/inputNumber.xhtml
【讨论】：
【参考方案10】：如果您只是在寻找整数值，您可以使用 JSF 2.2 passthrough attributes 来使用 input type="number"，如下所示：
<html xmlns:a="http://xmlns.jcp.org/jsf/passthrough">
<h:inputText a:type="number" value="#bean.integer" />
【讨论】：
【参考方案11】：试试这个
<h:inputText>
<f:validateRegex pattern="\d*(.\d+)?"/>
</h:inputText>
【讨论】：
无法使其与 JSF 1 一起使用。以上是关于只接受 h:inputText 值的数字的主要内容，如果未能解决你的问题，请参考以下文章
绑定到 Integer 属性的 h:inputText 正在提交值 0 而不是 null
如何在 jsf 中动态添加 h:inputText 而不会丢失之前动态添加的 h:inputText 值？ [复制]