我需要在更改为文本框时触发ajax更新,该文本框是< p:autoComplete>零件.我观察到如果用户选择手动键入文本,则事件是更改,而如果用户单击自动完成的其中一个建议,则事件为itemSelect.所以我添加了两个< p:ajax>输入的子节点,每个调用相同的方法并具有相同的更新列表,但是一个具有event =“change”而另一个event =“itemSelect”.

但是,我现在发现一些奇怪的东西.例如,在正常服务器模式下,我打开了我的页面并输入“12”.自动完成提供“1233”和“1234”作为建议.我点击了“1233”,似乎什么也没发生.我再次点击,其他一切都填写完毕.

在调试器中使用事件处理程序上的断点重复此操作,我可以看到在第一次单击后,值为“12”,在第二次单击时,它变为“1233”.

通过切换注释掉两个不同的< p:ajax>我可以看到不同的后果.如果没有“更改”,则在用户选择自动完成建议时从不调用处理程序,如果没有“itemSelect”,则在用户手动键入时不会调用处理程序.但是对于他们两个,有两个电话,我相信会有关于双击的投诉.

一些伪代码,对于那些喜欢,首先是xhtml:

<p:autoComplete id="itemId" value="#{myBacker.myBean.itemNumber}"
    required="true" completeMethod="#{myBacker.idAutoComplete}">
    <p:ajax event="itemSelect" update="beanDetails"
        listener="#{myBacker.idChangeEventListener()}" />
    <p:ajax event="change" update="beanDetails"
        listener="#{myBacker.idChangeEventListener()}" />
</p:autoComplete>
<h:panelGroup id="beanDetails">
    <h:panelGroup rendered="#{not empty myBacker.myBean.institutionName}">
        <h:outputText value="#{myBacker.myBean.institutionName}" />
        <!-- Continues with address,phone,etc..  -->
    </h:panelGroup>
</h:panelGroup>

然后是Java支持bean代码:

public void idChangeEventListener() {
    myBean = myDAO.getDetails(myBean);
    //  another couple of init-type method calls
}

解决方法

给父标记一个widgetvar属性,然后将这个小属性添加到< p:ajax event =“change”...>子标签:
onstart="if(widgetvarName.panel.is(':visible')) return false;"

当问题写好时,如果我没记错的话,我们在PrimeFaces 3.5版本上.从那时起,我们需要将解决方案更新为:

onstart="if(PF('widgetvarName').panel.is(':visible')) return false;"

感谢mwalter指出了变化.

jsf – PrimeFaces自动完成:itemSelect与change事件的更多相关文章

  1. Prime Faces错误消息以不同的样式显示

    我正在使用JSF2.3Mojarra和PrimeFaces7开发一个基于web的应用程序。我的问题是错误消息,我将其定义为根据我当前显示的页面,以不同的样式播种。我怀疑这是由于我使用的某些自定义样式,但我不确定。我有以下情况:1.)显示两条消息,其中一条消息在显示后不久消失。这一次,其中一个文本为白色,背景为红色,而另一个文本则为红色,背景为白色:3.)而且,我还有两个案例3a中。有没有一种方法可以像中的情况那样显示所有消息?

  2. 正则表达式 – 使用JSF 2/PrimeFaces中的正则表达式进行电子邮件验证

    我有一个输入字段采用电子邮件地址:如何使用JSF2/PrimeFaces中的正则表达式将输入的值验证为有效的电子邮件地址?

  3. jsf – 仅在第二次点击时调用操作

    我想提交一个按钮点击的数据表,但该操作在第一次单击时不会被调用.这是我的代码:问题是,在第二次点击我的调用动作.但是在第一次点击时不会调用它.有任何想法吗?

  4. 使用AJAX的JSF表单帖子

    我希望以下表单使用AJAX.因此,在单击命令按钮并且不重新加载页面后,将显示注释.使用JavaServerFaces2.0需要更改什么?

  5. 使用AJAX更新JSF / Primefaces数据表中的单行

    使用AJAX时,如何更新p:datatable中的单行?我不想更新整个数据表,因为它有很多行,而且需要一些时间.我的布局:我尝试了一些像update=“clearance”等的东西,但它似乎没有用.我正在使用JSF2.1和Primefaces5.2您可以使用@row搜索表达式来实现这一点–它会更新表中的第n行.要更新当前行,您需要将行索引作为参数传递.在上设置rowIndexVar=“rowIdx”属性接着:

  6. jsf – 如何通过ajax验证两个密码字段?

    首先,使用真实的Validator验证输入.不要在动作事件方法中执行.对于你的具体问题,你只需要指定的执行属性中的两个字段,它只默认为当前组件.如果您将验证器附加到第一个输入,并将第二个输入的值作为

  7. jsf – 级联p:未设置selectOneMenu模型值

    .编辑:面-配置如果托管bean被@RequestScoped放置在请求范围内,则会发生这种情况.每个HTTP请求都会创建一个全新的bean实例,所有属性都设置为default.这样list变为空,因此在模型中没有设置值.通过@ViewScoped将bean放在视图范围中应该可以解决这个问题.也可以看看:>Howtochoosetherightbeanscope?

  8. JSF 2.0 AJAX:使用jsf.ajax.request(或其他方法)从javascript调用bean方法

    一些背景:我正在构建一个自定义的JSF组件.该组件基本上是一个文本编辑器,它应该有一个“保存”按钮来保存编辑器的内容字符串.当我使用CodeMirror库时,我需要使用javascript从编辑器中获取内容(字符串),并将其发送到服务器.因此,在这种情况下,我不能使用基于XML的JS调用,如f:ajax.问题:我打算用jsf.ajax.request发送字符串,但是它并不直接支持调用bean的方法.如何使用JSF以AJAX的方式调用bean中的方法?

  9. 在制作JSF Ajax请求时显示加载进度

    提出请求时,如何显示一些加载消息?

  10. JSF动态包括使用Ajax请求

    3在JSF2中,是否可以更改ui的src的值:使用Ajax请求动态地包含?谢谢.这就是我现在所拥有的是否可以使它成为Ajax?

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部