开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Primefaces AJAX表单“@update=”调用监听器两次

PrimeFaces是一个开源的JSF（JavaServer Faces）组件库，提供了丰富的UI组件和功能，使得开发者可以快速构建富交互的Web应用程序。AJAX（Asynchronous JavaScript and XML）是一种在不刷新整个页面的情况下，通过异步请求与服务器进行数据交互的技术。

在PrimeFaces中，使用AJAX表单时，可以通过"@update"属性来指定需要更新的组件或区域。当表单提交或某个事件触发时，指定的组件会被更新。然而，有时候会发现"@update"属性会导致监听器被调用两次的问题。

这个问题通常是由于JSF的生命周期和PrimeFaces的AJAX机制引起的。JSF的生命周期包括多个阶段，而PrimeFaces的AJAX请求会触发JSF的部分生命周期。当使用"@update"属性时，PrimeFaces会在JSF的"INVOKE_APPLICATION"阶段之前执行更新操作，然后在该阶段再次触发监听器。

为了解决这个问题，可以考虑以下几种方法：

使用PrimeFaces的p:ajax标签代替"@update"属性：p:ajax标签提供了更细粒度的控制，可以在事件触发时执行自定义的JavaScript函数，而不是直接更新组件。这样可以避免重复调用监听器的问题。
在监听器中添加条件判断：在监听器中添加条件判断，只有当满足特定条件时才执行相应的逻辑。这样可以避免重复执行监听器的代码。
使用f:ajax标签代替PrimeFaces的AJAX：如果不需要使用PrimeFaces的特定功能，可以考虑使用JSF自带的f:ajax标签来处理AJAX请求。f:ajax标签也可以实现类似的功能，但可能需要更多的手动配置。

总结起来，PrimeFaces的AJAX表单中使用"@update"属性可能会导致监听器被调用两次的问题。可以通过使用p:ajax标签、添加条件判断或使用f:ajax标签等方法来解决这个问题。

腾讯云相关产品和产品介绍链接地址：

腾讯云官网：https://cloud.tencent.com/
云服务器（CVM）：https://cloud.tencent.com/product/cvm
云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
人工智能平台（AI Lab）：https://cloud.tencent.com/product/ailab
物联网开发平台（IoT Explorer）：https://cloud.tencent.com/product/iotexplorer
移动应用开发平台（MPS）：https://cloud.tencent.com/product/mps
云存储（COS）：https://cloud.tencent.com/product/cos
区块链服务（Tencent Blockchain）：https://cloud.tencent.com/product/tencentblockchain
腾讯云元宇宙：https://cloud.tencent.com/solution/metaverse

相关搜索:a4j ajax监听器和ajax调用中的操作的区别。ajax代码不调用php文件、html表单 Ajax表单重新加载页面，而不是调用ajax代码 Ajax调用成功函数触发两次 ASP.NET MVC中Ajax表单两次提交调用方法 Flask:为什么提交表单时不调用AJAX？jQuery AJAX调用两次为什么ajax表单在更改复选框时提交两次？仅当表单验证时才触发ajax调用从onsubmit调用ajax的表单验证

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

流行的9个Java框架介绍: 优点、缺点等等

PrimeFaces库确实是轻量级的。它打包为一个JAR文件，需要零配置，并且没有任何依赖项。...Spring框架利用了控制反转(IoC)软件设计原则，根据该原则，框架控制定制的代码(而不是传统的编程，将自定义代码调用到处理通用任务的其他库中)。...因此，它为您提供了动态类重载、异常报告、Ajax支持以及内置组件和模板等特性。 Tapestry也是一个开发人员友好的框架。...由于Wicket是一个基于组件的框架，所以Wicket应用程序由可重用的页面和组件(如图像、按钮、链接、表单等)组成。...它内置的Ajax功能允许您实时更新页面的某些部分，而不需要编写任何JavaScript代码。Wicket也注意安全的URL处理。组件路径是会话相关的，url不会显示任何敏感信息。

3.4K2 0

easyui+ssm+shiro做的登录注册修改密码审核用户(四)

根据这张效果图，我们可以需要一个form表单用来传递参数，参数一共有两个，还有两个按钮修改密码的form表单代码如下，前端通过ajax把name值传给后台 <div class="form-bottom...newPwd) { return userService.updatePwd(userName, password, newPwd); } 修改密码的service实现方法改方法的业务逻辑如下：先<em>调用</em>...userName", userName); para1.put("newPwd", String.valueOf(result1));*/ //调用...-- 修改用户密码 --> update SYS_USER set...PASSWORD=#{password} where ID=#{id} 解决form表单一保存就自动刷新的问题在form表单上加个 target="iframe" 的属性

2K1 0

Vue 学习笔记 —— 常用特性（二）

自定义指令计算属性 监听器 滤器器生命周期二、表单操作 2.1 基于 Vue 的表单操作概览 input 单行文本 textarea 多行文本 select 下拉多选 radio 单选框 checkbox...，后台调用 ajax 来请求后端的数据。...调用后台的方法 console.log(this.project); } } }) script> 2.7 表单域修饰符 number 转换为数值 trim：去掉开始和结尾的空格...这也证明了计算属性在某方面确实性能比方法搞很多五、侦听器（watch）侦听器简单的来说就是数据有变化就通知监听器所绑定的方法。...验证基本流程我们使用 v-modal 实现用户的双向绑定 监听器用来监听用户输入的用户名的变化用户输入完毕，调用后台接口实现验证，这里简化操作，使用定时器模拟 ‘验证’ 的操作。

4.8K2 0

利用动态注入HTML的方式来设计复杂页面

对于一个复杂页面来说，我们也只需要将其设计成一个容器，至于运行过程中动态显示的内容则可以通过Ajax调用获取相应的HTML来填充。...tr> 25: } 26: 27: 从QueryFormPartial.cshtml的定义可以看到，表单成功提交之后会调用一个名为...的方式访问Action方法Update，当前联系人ID会作为请求的参数（@Ajax.ActionLink(contact.Id, "Update", new { contactId = contact.Id...JavaScript函数showDialog实现（@Ajax.ActionLink(contact.Id, "Update", new { contactId = contact.Id }, new...POST的方式提交到HomeController的Action方法Update（@using(Ajax.BeginForm("Update", null, new AjaxOptions { HttpMethod

3.5K2 0

前端面试指南之React篇（二）

componentDidMount：在第一次渲染之后执行，可以在这里做AJAX请求，DOM 的操作或状态更新以及设置事件监听器。...componentWillUnmount：它用于取消任何的网络请求，或删除与组件关联的所有事件监听器。...表单如何呈现由表单元素自身决定。如下所示，表单的值并没有存储在组件的状态中，而是存储在表单元素中，当要修改表单数据时，直接输入表单即可。有时也可以获取元素，再手动修改它的值。...;通过 subscribe(listener)返回的函数注销监听器使用状态要注意哪些事情？...两者通过React-Redux 提供connect方法联系起来在生命周期中的哪一步你应该发起 AJAX 请求我们应当将AJAX 请求放到 componentDidMount 函数中执行，主要原因有下React

2.8K12 0

AJAX如何处理书签和翻页按扭（上）

AJAX应用程序中添加书签和会退按钮的功能。...本文把这个框架提供的重要发现分两个部分来说明：首先，一个隐藏的HTML表单用来缓存大量短暂的在客户端信息。这些缓存为网页导航提供了强大的支持。...AJAX 应用程序把自己注册为历史浏览的监听器，当用户使用 “前进”“回退”按钮来浏览时，历史浏览时间被触发，调用 add() 方法来提供给浏览器新的地址，并保存历史数据。...我们起初通过使用隐藏的表单字段来实现，因为浏览器自动保存一个表单中字段值，甚至用户离开网页的时候也如此。...当用户回退时，浏览器将会把对象返回给历史浏览变动监听器。开发者可以给historyData提供带有嵌套对象和用数组表示的复杂JavaScript对象。

8643 0

如何解决jQuery Validation针对动态添加的表单无法工作的问题？

为了充分利用ASP.NET MVC在服务端呈现HTML的能力，在《利用动态注入HTML的方式来设计复杂页面》一文中介绍了，通过Ajax调用获取HTML来呈现复杂页面中某一部分界面的解决方案。...我们知道ASP.NET MVC默认集成了jQuery Validation，但是对于通过JavaScript动态添加的表单，客户端验证默认情况下是失效的。...input type="submit" value="Save" /> 9: } 默认Action方法Index对应的View（Index.cshtml）具有如下定义，页面主体内容是在加载的时候通过Ajax...方法访问Action方法Update获取的。...为了解决这个问题，可以在动态注入表单之后按照如下的方式调用$.validator.unobtrusive.parse()对表单元素进行重新解析。

1.9K9 0

Ajax详解

===》Ajax详解《=== Ajax特性 1 1、Ajax是什么？...4 ---在xmlHttp对象的一个事件上注册监听器：onreadystatechange ---xmlHttp对象一共有5个状态：》0状态：刚创建，还没有调用open方法；》1状态：请求开始：调用了...open方法，但还没有调用send()方法》2状态：调用玩了send()方法；》3状态：服务器已经开始响应，但不表示响应结束！.../x-www-form-urlencoded"); * send：xmlHttp.send("username=zhangSan&password=123");//发送请求时指定请求体第三例：注册表单之校验用户是否注册...1 编写页面： * ajax3.jsp > 给出注册表单页面 > 给用户名文本框添加onblur事件的监听 > 获取文本框的内容，通过ajax4步发送给服务器，得到响应结果 * 如果为1：在文本框后显示

1.3K9 0

脚本化HTTP 取得响应指定请求

用户的页面停留，直接计算两次加载的时间差即可。数据库完成统计即可。一个最简单的页面统计完成。 iframe 一个淘汰的标签。...其他一些更多的通信协议，包括rpc（远程过程调用）允许运行于一台计算机的程序调用另一台计算机程序的子程序。如果面向对象编程，则远程过程调用为远程调用，远程方法调用。...对于POST来说，常常用于HTML表单，它在请求主体中包含额外数据，即表单数据，且这些数据常常储存到服务器的数据库中。此请求不会被缓存。...最后调用send()方法，完成发送。顺序问题:必须先调用open后调用send()才方可。...new XMLHttpRequest(); request.open('GET', url); // 指定url request.onreadystatechange = () => { // 监听器

1.4K4 0

form实现表单提交的各种方法(表单提交源码)

name=”form” method=”post” action=”#”> 提交这种方法实际上是调用了一个...” onclick=”update();” value=”更新”> 上面一段代码，使用的是普通的按钮，而提交功能的实现方法是在它的onclick事件中调用javascript函数....给input type=’button’添加onclick事件，验证通过则调用submit()方法提交 <...//验证不通过 return false; } document.getElementById("form1").submit(); } 使用ajax...="button" onclick="login()">提交 function login() { $.ajax

4.6K3 0

React面试题精选

当我们引入原生的HTML表单元素（input,select,textarea,等）时，我们是要遵循react的“单一数据源”将数据托管到react组件还是和以往处理HTML表单一样交由DOM进行控制？...主要的原因就是受控组件有助于进行表单验证，控制按钮是否可点击，强制输入格式，并且它也更符合“React way” ---- 在生命周期的哪个阶段发生ajax请求而且为什么？...权衡componentWillMount 函数在一次生命周期中可能被调用多次，将Ajax请求放在这个函数里就具有了不确定性。这对Ajax请求来说是个不是个好的选择。...若考虑其它函数，你不能保证AJAX请求在component在被挂载之前被不会进行响应。...React使用一个单独的事件监听器来将所有事件发送到顶层处理。这对性能有很大的好处，因为它让React无需在更新DOM的时候去跟踪附着在DOM的每一个事件监听器。

2.7K4 2

浅谈Django前端后端值传递问题

前端后端传值问题总结前端传给后端通过表单传值 1、通过表单get请求传值在前端当通过get的方式传值时，表单中的标签的name值将会被当做action的地址的参数此时，在后端可以通过get请求相应的...post请求传值当前端通过post传值时，在视图中可以通过POST请求拿到对应的表单中的name属性对应的value值通过ajax传值 POST ———————————– 通过ajax的post请求可以将...({ url: {% url 'scene_update_url' %}, type: "POST", data: post_data, success: function (data) {...; } else { alert(data["result"]); } } }); } success:function(data,status,xhr){} --- data:请求成功时调用的函数...status:描述状态的字符串 xhr:jqXHR 模板中: def scene_update_view(request): if request.method == "POST": name =

4.2K2 0

jQuery介绍，一篇就够了！

$(element).data({ x: 1, y: 2, z: 3 }); DOM-Tree Traversal DOM-Select //过滤器筛选表单元素:disabled、:enabled....ready(function(){ //do something }); $(function(){ //do something }); //增加事件监听器...event.keyCode === 65) { console.log(123); e.stopPropagation(); e.preventDefault(); } }); //移除事件监听器...CSS) escape('中文转Unicode').toLocaleLowerCase().replace(/%u/gi,'\\'); //为jQuery扩展min,max两个方法，通过调用...$.ajaxStop(callback); //设置Ajax全局预设值 $.ajaxSetup(options); //获取表单序列化结果 $("form").serialize(); //return

1602 1

Django中使用下拉列表过滤HTML表格数据

这通常涉及两个主要步骤：创建过滤表单和处理过滤逻辑。创建过滤表单首先，你需要创建一个表单，用于接收用户选择的过滤条件。...处理过滤逻辑并渲染HTML表格接下来，在视图中处理表单提交和过滤逻辑，然后在HTML模板中渲染过滤后的数据。...2、解决方案为了解决这个问题，我们可以使用 Ajax 技术来实现下拉列表的动态变化。Ajax 允许我们在不刷新整个页面的情况下与服务器進行通信。...在 JavaScript 代码中，添加一个事件监听器，监听下拉列表的选项改变事件。当下拉列表的选项改变时，使用 Ajax 向服务器发送一个请求，服务器根据请求参数返回过滤后的数据。...使用 Ajax 技术，我们可以轻松实现下拉列表的动态变化，从而让用户可以选择不同的条件进行数据过滤。以下是一个实现上述步骤的代码示例：<!

1001 0

注册页面表单js验证，手机验证码验证，阻断提交表单的可行性方案（移植性极强）

-- /.form-box --> 2、对每个表单字段进行验证（1）对phone表单进行js验证，在验证时使用了正则判断是否是手机号，同时通过ajax去后台查询phone是否已注册。...//两次密码确定 $("[name=repassword]").blur(function () { if ($("[name=repassword]").val() !...repassword]").next().text(""); }else{ $("[name=repassword]").next().text("两次密码输入不一致...该循环settime（）在上面成功获取验证码后调用了，代码如下： //倒计时代码 var countdown=60; function settime() { if (countdown...（2）当我们不去输入表单时，我们的表单就有空的，也会阻断。（3）这一前一后的判断，就能保证我们的提交内容符合要求。

3.5K2 0

ajax传参形式

:00:00 +0800 update: 2018-12-31 23:00:00 +0800 author: me cover: http://ww1.sinaimg.cn/large/006jIRTegy1fyqcsjhs54j31p40ye7hh.jpg...介绍几种参数形式 tags: 前端 ---- 文章目录 ajax传参形式介绍选项详解传参几种形式 URL拼接传参 JSON传参表单序列化传参拼接data 表单序列化为JSON数据传参表单序列化为...complete Function 请求完成后回调函数 (请求成功或失败时均调用)。参数： XMLHttpRequest 对象，成功信息字符串。...使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。...var params=$('#login').serialize(); //把id为login的form表单里的参数自动封装为参数传递 $.ajax({ url: "/login/authenticate

4.2K4 0

代替ajax方法fetch()请求方法

XMLHttpRequest来完成ajax有些老而过时了。fetch()能让我们完成类似 XMLHttpRequest (XHR) 提供的ajax功能。...XMLHttpRequest一个 XMLHttpRequest 请求需要两个监听器来捕捉 success 和 error 两种情形，而且需要调用 open() 和 send() 方法。...也就是说，当我们调用 json() 方法时，返回的仍是一个 Promise 对象，这是因为对 stream 的读取也是异步的。...我们的fetch() 调用链条中，首先如果fetch()执行结果是 resolve，那么，接着会调用 json() 方法，这个方法返回的也是一个 Promise，这样我们就得到一个分析后的JSON对象。...用fetch执行表单数据提交在WEB应用中，提交表单是非常常见的操作，用fetch来提交表单数据也是非常简洁。fetch里提供了 method 和 body 参数选项。

1231 0

Django实战-信息资讯-Ajax 实现注册

前一篇使用 Django 自带的 form 表单直接渲染到前端生成注册表单，而且对注册表单里的字段进行了再次验证判断，重写 clean 方法 is_valid。 ?...① 定义请求返回数据不管是 POST 请求，还是 GET 请求，通过 ajax 返回的都需要是 json 数据格式。...message,"data":data} if kwargs and isinstance(kwargs,dict) and kwargs.keys(): json_dict.update...的方式注册，同样可以将前端传递过来的数据，通过 Form 注册表单验证。...通过 ajax 调用 post 方法 ? js 封装请求 ? ?

1.2K2 0

javaweb 与jsp页面的交互流程 (初次接触时写)

发送ajax请求 1. jsp通过form表单向servlet发送请求 ``` <form action="${pageContext.request.contextPath }/LoginServlet...}); ``` 后台java先通过 servlet接收请求 1. servlet 层首先接收请求然后收集数据，利用收集到的数据实例化成实体对象最后new一个service对象，<em>调用</em>...QueryRunner queryRunner = new QueryRunner(JDBCUtils.getDataSource());//和数据库建立链接 String sql = "update..."; Object[] params = {user.getPassword(),user.getId()}; queryRunner.update(sql...ajax 方式提交的话，就可以在ajax的回调函数中直接利用js/jquery修改html的dom节点或者跳转页面

2.1K2 0

java学习与应用（4.6）--过滤器、监听器、JQuery、AJAX、JSON等

proxy为代理对象，method为代理对象被调用的方法，args为被调用时传递的参数。...监听器 Listener监听器：注册监听：将事件、事件源、监听器绑定在一起。当事件源上发生某个事件后，执行监听器代码。...过滤器选中的元素后加的冒号进行过滤，表单转转等。 JQuery的DOM操作内容操作方法如：html获取标签体内容，text获取存文件内容，val获取属性value值。可以获取并修改其内容。...该方法可以被JQuery对象调用[使用对象调用]，或直接用$.方式调用[全局]。 ?...AJAX AJAX（Asynchronous JavaScript And XML）,异步的JavaScript和XML。异步方式下，客户端发出请求后不被服务器响应阻塞，客户端可以进行其它操作。

5.4K1 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭