ajax - 如何将 keyup ajax 请求推迟到 h :inputText length is reached

Question

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

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

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

我不知道是否有与使用 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);
}

以及 View :

<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 提取输入字符串的日期和时间部分并返回一个日期对象。

我正在使用

• primefaces 5.2
• 莫贾拉2.2.8

编辑 1

按照 BalusC 的建议，我修改了我的 h:inputText，但似乎什么也没有发生。这是我的原始代码(除了 Controller 名称)。我在 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的回答...

Answer 1

就return false来自onkeyup只要value.length尚未达到所需值。

例如

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