如何将keyup ajax请求延迟到h:inputText长度



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

我想达到以下目标:textInput字段必须填写日期和时间的组合值。预期格式为: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);
}

和观点:

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

我正在使用

  • 素数面5.2
  • 莫哈拉2.2.8

编辑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的答案。。。

只要value.length没有达到所需值,就从onkeyup中选择return false

例如

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

相关内容

  • 没有找到相关文章

最新更新