如何使用包含验证错误的输入字段突出显示 p:tab
How to highlight p:tab's with inputfields that contain validation errors
一个大表单有几个输入字段,因此它们被分组在 primefaces tabview 选项卡中。其中一些字段是必填的。当用户尝试提交时,它会收到所需的消息,但用户必须滚动浏览所有选项卡才能找到缺少的字段。有什么方法可以突出显示缺少值的选项卡吗?
您可以进行服务器端验证。因此,如果发生验证错误,您知道错误所在的选项卡。
然后您可以使用 TabView
的 activetabindex 并激活您想要的选项卡。
然后您可以使用 Spotlite
作为 @fuggerjak61 所说的定位 missing/not 有效字段。
我会亲自做这个客户端。
- 我会首先检查验证是否总体失败,或者不像这里的 PrimeFaces 解决方案那样:
- How to find indication of a Validation error (required="true") while doing ajax command
- 在您可以调用的 javascript 函数中,我会通过 jquery 找到周围的表格。
- jQuery find parent form
- 从那个表格向下,我会通过 jquery 找到所有带有 css class 的输入,表示错误。
- jquery find element by specific class when element has multiple classes
- 从每个错误中,我会找到作为 div 选项卡的祖先元素(这可能是您需要最具创意的地方,但它都是普通的 jquery如果你把它变成一个简单的 jquery 问题,很多人可以帮助你)并添加一个 css class 这样你就可以设置它的样式 'in error'。
- 我会再次使用 jquery 找到第一个有错误的选项卡,然后 'fake' 单击它。
- find first occurrence of class in div
- Simulate a click on 'a' element using javascript/jquery
一个大表单有几个输入字段,因此它们被分组在 primefaces tabview 选项卡中。其中一些字段是必填的。当用户尝试提交时,它会收到所需的消息,但用户必须滚动浏览所有选项卡才能找到缺少的字段。有什么方法可以突出显示缺少值的选项卡吗?
您可以进行服务器端验证。因此,如果发生验证错误,您知道错误所在的选项卡。
然后您可以使用 TabView
的 activetabindex 并激活您想要的选项卡。
然后您可以使用 Spotlite
作为 @fuggerjak61 所说的定位 missing/not 有效字段。
我会亲自做这个客户端。
- 我会首先检查验证是否总体失败,或者不像这里的 PrimeFaces 解决方案那样:
- How to find indication of a Validation error (required="true") while doing ajax command
- How to find indication of a Validation error (required="true") while doing ajax command
- 在您可以调用的 javascript 函数中,我会通过 jquery 找到周围的表格。
- jQuery find parent form
- jQuery find parent form
- 从那个表格向下,我会通过 jquery 找到所有带有 css class 的输入,表示错误。
- jquery find element by specific class when element has multiple classes
- jquery find element by specific class when element has multiple classes
- 从每个错误中,我会找到作为 div 选项卡的祖先元素(这可能是您需要最具创意的地方,但它都是普通的 jquery如果你把它变成一个简单的 jquery 问题,很多人可以帮助你)并添加一个 css class 这样你就可以设置它的样式 'in error'。
- 我会再次使用 jquery 找到第一个有错误的选项卡,然后 'fake' 单击它。
- find first occurrence of class in div
- Simulate a click on 'a' element using javascript/jquery