如何推迟 keyup ajax 请求直到达到 h:inputText 长度

How to postpone a keyup ajax request until h:inputText length is reached

有没有办法将 keyup ajax 请求推迟到 h:inputText 值达到定义的长度?

我想达到以下目标: textInput 字段必须填充日期和时间的组合值。预期格式为:ddMMHHmm

一旦值达到 8 个字符的长度,就必须将新的事件对象添加到数据列表中,并应立即显示以供确认。 要确认添加新事件,用户只需在此文本输入字段中按下回车键即可。

我不知道是否有与使用 ajax keyUp 事件验证输入不同的功能,无需任何进一步的用户交互?

在这里你可以看到我的想法的一个非常简短的例子:

@Named
@SessionScoped
public class EventController {

  private Date          selectedDate; // +getter/+setter
  private MyEvent       event;
  private List<MyEvent> events; // ArrayList<MyEvent>(), +getter

  @PostConstruct
  private void init() {
     // load current events from DAO
  }

  public void validateInput() {
    event = new MyEvent(selectedDate);
    events.add(event);
  }

  public void confirmEvent() {
    eventDAO.addEvent(event);
}

和视图:

<h:inputText
  value="#{eventController.selectedDate}"
  converter="#{comfortableDateTimeInputConverter}"
  id="inputDateTime">
  <f:ajax
        <!-- pseudo code on  !!! -->
        executeCondition="<lengthOfInputField equals 8>" 
        <!-- pseudo code off !!! -->

        execute="inputDateTime"
        render="eventData"
        event="keyup"
        listener="#{eventController.validateInput}"
  />
</h:inputText>
<h:commandButton ... actionListener="#{eventController.confirmEvent}" />

<h:panelGroup id="eventData">
  <h:dataTable var="..." value="#{eventController.events}">
    // display event properties
  </h:dataTable>
</h:panelGroup>

ComfortableDateTimeInputConverter 提取输入字符串的日期时间部分和 returns 日期对象。

我正在使用

编辑 1

按照 BalusC 的建议,我修改了我的 h:inputText,但似乎什么也没有发生。这是我的原始代码,除了控制器名称。我在 eventController.validateNewEvent 里面添加了一条日志消息,但它似乎没有被执行。我错过了什么吗?

<h:inputText
  readonly="#{empty eventController.selectedPerson}"
  value="#{eventController.selectedDate}"
  id="inputDateTime"
  tabindex="3"
  converter="#{comfortableDateTimeInputConverter}"
  onkeyup="return value.length >= 8"
  onfocus="this.select()">
  <f:ajax
        event="keyup"
        execute="inputDateTime"
        listener="#{eventController.validateNewEvent}"
        render="selectedDate txtDate listEvents" />
  </h:inputText>

我也尝试在 ajax 元素处 render="@all",但仍然没有任何反应。如果我使用 event="blur" 并使用 TAB 保留输入,它就像一个魅力...

编辑 2(已解决)

已替换

onkeyup="return value.length >= 8"

onkeyup="return this.value.length >= 8"

并且有效。见 BalusC 的回答 ...

只要 onkeyup 中的 return false 只要 value.length 还没有达到期望的值。

例如

<h:inputText ... onkeyup="return this.value.length >= 8">
    <f:ajax event="keyup" ... />
</h:inputText>