时间戳

首页 > 解决方案 > 在 InputText 中添加或删除可见字符后触发 valueChange 事件

jsf - 在 InputText 中添加或删除可见字符后触发 valueChange 事件

问题描述

我需要一个valueChange事件，每次添加或删除可见字符时都会触发该事件。

我有 2 个输入文本字段，其中一个是只读的，一个是命令按钮。

<div>
  <p:inputText>
    <p:ajax id="encodedString" event="valueChange"/>
  </p:inputText>

  <p:commandButton action="#{bean.foo}" update="output"/>

  <p:inputText id="output" readonly="true">
  </p:inputText>
</div>

现在，用户在第一个字段中输入一些编码字符串并按下按钮，然后解码字符串并在只读输入字段中以人类可读的形式呈现。现在，每当用户操作原始字符串时，都应该重置输出，因为它不再代表原始编码字符串。

遗憾的是，该valueChange事件仅在输入字段失去焦点时触发。我已经尝试过该keypress事件，但它也会在按下箭头键等按钮时触发。

JavaScript 对我来说是可行的，但如果可能的话应该省略。

每当实际输入发生变化时，触发valueChange事件（或类似事件）的最佳方式是什么？即添加或删除可见字符时。

标签： jsfprimefaces

解决方案

您基本上需要 HTML DOMinput事件。不幸的是，不支持这个相对较新的事件，因为（还？）不支持该属性。<p:ajax><p:inputText>oninput<p:inputText>

但是，您可以利用JSF 2.2 的传递属性特性来强制 JSF 呈现一个oninput属性，而您又显式地触发了默认onchange()函数。

<... xmlns:a="http://xmlns.jcp.org/jsf/passthrough">

<p:inputText value="#{bean.value}" a:oninput="onchange()">
    <p:ajax listener="#{bean.listener}" />
</p:inputText>

没错，这涉及到 JavaScript，但实际上只是一点点。

请注意，我已从中删除event="valueChange"，<p:ajax>因为这已经是默认设置了。

推荐阅读