在Primefaces inputText required=true中，如何在输入内容后立即删除ui-state-error？
在Primefaces中，当使用inputText组件并将required属性设置为true时，如果用户没有输入内容，组件会自动添加一个名为"ui-state-error"的CSS类来标记该输入框为错误状态。如果用户输入了内容并希望立即删除该错误状态，可以通过以下几种方式实现：
- 使用JavaScript：可以通过在inputText组件上绑定一个JavaScript函数来实现。在函数中，可以通过获取inputText组件的DOM元素，并移除"ui-state-error"类来删除错误状态。示例代码如下：
<p:inputText id="myInput" required="true" onkeyup="removeErrorState()" />
<script>
function removeErrorState() {
var input = document.getElementById('myInput');
input.classList.remove('ui-state-error');
}
</script>- 使用Primefaces的Ajax功能：可以通过使用p:ajax标签来实现。在inputText组件上添加一个p:ajax标签，并设置event为keyup，然后在oncomplete属性中使用JavaScript代码来移除错误状态。示例代码如下：
<p:inputText id="myInput" required="true">
<p:ajax event="keyup" oncomplete="removeErrorState()" />
</p:inputText>
<script>
function removeErrorState() {
var input = document.getElementById('myInput');
input.classList.remove('ui-state-error');
}
</script>以上两种方法都是通过JavaScript来操作DOM元素，实现移除"ui-state-error"类从而删除错误状态。需要注意的是，这只是一种前端的处理方式，如果需要进行后端验证，仍然需要在服务器端进行验证。
相关·内容
提交包含必需inputText的表单时，指示未验证字段的样式将保持不变，直到再次提交。我希望编辑该字段后，样式立即消失。<p:inputText value="#{data.bezeichnung}" styleClass="panelInputFieldinput_mandatory"
required="t
浏览 7提问于2017-02-17得票数 0
回答已采纳
" style="width: 200px" value="#{projectMilestoneDataBean.projectId}" required="true" requiredMessage=}" required="true" requiredMessage="#{msg.milestone_name_required}" >}" required</
浏览 4提问于2014-05-19得票数 0
我有一个PrimeFaces的p:inputText组件，我还设置了required="true“和requiredMessage="$$$$$$$$”。在显示$$$$$$$$$消息后，单击RESET按钮后，对于me.ie，这些消息和输入文本字段的高亮显示必须消失。如何在单击例如:的重置按钮时使p:inputText的所需消息和高亮显示消失。id="username" labe
浏览 0提问于2013-07-16得票数 0
我已经添加了primefaces inputtext与inplace，以具有只读和编辑文本双击只读文本。只有当我在编辑器模式下单击勾号图标时，inplace事件才会触发ajax侦听器。我在下面的链接中引用了来自primefaces showcase的内容。https://www.primefaces.org/showcase/ui/input/inplace.xhtml <p:inplace id="stackS
浏览 49提问于2019-05-08得票数 1
在PrimeFaces中，当我使用： requiredMessage="message" update="infoText"
listener="#{backingBean.something()}&qu
浏览 0提问于2011-07-12得票数 4
回答已采纳
当我将inputText设置为required时，与inputText关联的outputLabel将自动获得一个星号。如何防止星号的出现？<p:outputLabel value="Target Species" for="idInputText" />
<p:inputText id="idInputText" required="true" value="#{co
浏览 4提问于2014-02-10得票数 8
回答已采纳
2回答
验证失败后，如何设置组件的样式？我有以下文本字段：我正在尝试更改颜色后：
<p:commandButton id="submit" value="Login"
浏览 4提问于2012-12-09得票数 2
回答已采纳
问题是form位于一个JQueryUI dialog中(因为我不知道如何在JSF中创建“窗口”)，所以当我单击commandButton时，页面被刷新，和JQuery对话框丢失。刷新后，通过查看源代码，我可以看到错误消息是打印在页面代码中的。如果我在ajax中使用commandButton，那么页面就不会刷新，但是我没有打印消息，我在浏览器中得到了类似于"Javascript警告“的消息。
如何在不刷新页面
浏览 0提问于2018-03-13得票数 0
回答已采纳
3回答
我正在使用facelets jsf 2.0和primefaces 3.0.M2组件库。我正在尝试实现动态行数，包括在发生datatable选择时填充的iput字段。下面是我如何在facelet中迭代列表；
<ui:repeat value="#{goalEntranceBean.selectedCard.parameterList}" var="prmBean"id="wx" required="true&quo
浏览 2提问于2011-08-17得票数 4
使用JSF6.1和PrimeFaces 6.1，我有一个inputText字段如下： <p:ajaxevent="valueChange" update="@form" />在同一表单中有一个commandButton：
<p:commandButt
浏览 2提问于2017-05-03得票数 5
回答已采纳
我需要需要由<h:form>包装的primefaces元素的列表，以便通过<p:ajax>的任何操作进行更新
一些primeface元素，即使它们有id，在<p:ajax update="thisID">中，它仍然需要一个带有id的<h:form>才能被更新，所以哪些元素需要<h:form>，哪些不需要
浏览 0提问于2012-11-22得票数 0
回答已采纳
我有一个primefaces： value="#{myBean.lista}" <p:inputText
required="true" i
浏览 2提问于2015-08-10得票数 1
回答已采纳
作为一个例子，请考虑以下带有primefaces输入组件的简单表单，其中有些组件是必需的： placeholder="First Name right here please." />
浏览 1提问于2019-03-12得票数 2
回答已采纳
我在PrimeFaces 4.0中使用JSF2。<h:form id="form">
<p:inputText id="id" value="#{bean.user.id
浏览 3提问于2014-01-17得票数 6
回答已采纳
我使用validatorMessage作为电子邮件输入的正则表达式，但我希望在{0}位置显示消息中输入的当前值。但是如果我使用在bean中声明的变量，它就不能工作，因为它不处理变量，因为存在验证错误。如何在validatorMessage中的输入中显示当前值？注意：{0}用于当前值的PrimeFaces区域设置中，并进行验证。required="true
浏览 2提问于2015-11-09得票数 0
如何在一个页面中有多个<h:message>标记显示不同的内容？}" <h:commandButton id="submit" value="insert" action="#{insertDocCon
浏览 2提问于2013-12-16得票数 2
回答已采纳
1回答
我们有一个p:inputText元素，它应该为各种选项显示一个覆盖面板。(这是一个全局搜索，因此您可以勾选要搜索的类别)<p:overlayPanel id="gsOverlay" for="searchItem" my="lefttop"
at="le
浏览 6提问于2015-06-30得票数 2
回答已采纳
1回答
下面是登录(amx)页面中的一段代码。" <amx:inputText required="true"
sho
浏览 4提问于2013-12-25得票数 2
在XHTML页面中，我使用的是Primefaces 3.5版。尽管如此，还是可以改变其他selectOneMenu的值，也不能再使用TAB按钮改变焦点，即使是在selectOneMenu组件中也是如此。只有通过鼠标点击才能改变焦点。="true"> </p:column>
</p:ro
浏览 2提问于2017-04-19得票数 0
1回答
inputFieldId" />一切都按预期工作，但我希望改善用户体验，并希望引入纯客户端验证，使用我试过了，但当onBlur事件在inputfield我的输入域的一个例子是：styleClass="#{component.valid ?'reportInput' : 'reportIn
浏览 0提问于2014-02-14得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
