问题标签 [constraint-validation]

我们正在使用 HTML5 表单验证，而不会覆盖验证错误消息的默认系统 UI。这在任何地方都可以正常工作，但在 iOS Safari 上，验证消息在气泡弹出窗口内没有正确对齐。我们已经在两个完全独立的设备上以不同的形式对此进行了测试。即使是没有 CSS 的最小表单也有相同的结果：

https://jsfiddle.net/GinSan/48hnrf92/1/

这是我们测试的 iOS 设备上验证消息的样子：

验证消息与顶部对齐而不是居中对齐，即使这是一个系统 UI 元素。这是一个已知问题吗？除了向苹果报告并等待修复或替换系统验证消息之外，有什么可以做的吗？

我有一个包含必填字段的表单，当我尝试提交带有空白必填字段的表单时，会显示一条错误消息，如下面的屏幕截图所示。使用 Java 中的 Selenium 无法识别是否显示错误消息，因为这些错误是 HTML5 并且它们在 Dom 中不存在。所以我用谷歌搜索，发现我们可以使用 Javascript。但是当我使用它时，即使显示了消息，我每次都会变得错误。您的帮助将不胜感激。

WebElement field = driver.findElement(By.xpath('//input[@id='frstNm']'))

WebElement registerBtn = driver.findElement(By.xpath('//div//button[text()='Register']'))

registerBtn.click() Boolean is_valid = ((js.executeScript('return arguments[0].checkValidity();', field)) as Boolean)

String message = ((js.executeScript('return arguments[0].validationMessage;', field)) as String)

println(is_valid)

html:

表格截图

我正在为 HTML5 原生表单验证而苦苦挣扎。我对客户端表单验证的理解是您可以手动设置元素的有效性状态setCustomValidity()。但是，这似乎并没有覆盖任何本机验证。

例如，如果我有一个字段，required="required"并且该字段为空，则它是无效的（如预期的那样）。如果我调用setCustomValidity('')该字段，我希望它会覆盖并将其设置为有效，但这不会发生。

novalidate然后我认为当我希望该字段有效时可以动态添加到该字段，但如果我checkValidity()在添加后调用novalidate它仍然返回false。似乎novalidate只允许提交表单而不考虑字段有效性，但仍然考虑该字段:invalid。

我错过了什么，还是这是预期的行为？另外，是否有覆盖任何默认验证并将字段的状态手动设置为:valid？我希望setValidity(true|false)在约束验证 API 中可以使用类似的东西。

更多上下文：

我需要根据另一个字段值切换字段约束。例如，假设我有以下标记：

如果用户为“有文档？”选择“是”，那么我想要documentFile并且documentType被要求。到目前为止，我唯一可行的解​​决方案是在选择“是”时动态添加required="required"属性，documentFile然后手动调用.documentTypecheckValidity()

这可行，但并不理想。我有很多这些条件验证并不总是像只需要或不需要那么简单。几天来我一直在搜索 google 和 stackoverflow.com，但还没有找到另一个可行的解决方案。

更新

我尝试过的 JS 的简化示例：

网址 - https://www.vtiger.com/begin-free-trial

输入无效的电子邮件地址，例如“abcde”，然后单击下一步按钮。您会注意到一条错误消息，该消息将显示 4/5 秒（下图）

我们如何验证此错误消息，我也无法获取此错误消息。

checkValidity()我正在查看约束验证 API，并在网上找到了一些似乎调用<form>元素的示例代码：

但我自己尝试过这样做，但没有成功。我在其他任何地方也找不到任何关于这可能的参考。据我所知，它不能被调用<form>。有人可以帮我吗？

I have a client who wants me to punctuate all currency inputs with commas and dollar signs. This means that I have to use a text input instead of a number input, which means that I cannot take advantage of the inbuilt validation that number inputs have, chiefly min, max, step, and simply validating that what the user enters is in fact a numeric string. My idea is therefore to create a text input copy of the actual numeric input, hide the actual one, format the contents of the text input as the user types, and copy them over into the hidden numeric input so that they can be validated and submitted from there. What is the best way with javascript to display any validation errors that might pop up from the hidden number input? I am specifically looking at the constraint validation api:

https://developer.mozilla.org/en-US/docs/Web/API/Constraint_validation

Here's the example html:

So I am wanting to find a way to take any validation objects in the DOM for the first input and copy them over to the 2nd. I have tried this so far (see below), but it appears that the validity and validationMessage DOM properties are readonly:

我一直在尝试对我的自定义约束注释进行单元测试（不运行 Spring 容器），但是当我运行测试时抛出 NullPointerException 并且我不知道为什么会发生这种情况。

this.validator = nullNullPointerException在 Validator 类中指出了这一点。

我在编写测试时遵循了这个答案https://stackoverflow.com/a/41671471/9377513 。但我不知道为什么这种方法在我的情况下不起作用。

测试期间抛出的整个异常：

我的自定义约束注释：

我的自定义约束验证器：

还有我的测试课：

任何形式的帮助将不胜感激。

我有一个 Spring 应用程序，我正在实现 ConstraintValidator 以便使用 spring 验证进行一些验证

控制器：

界面：

我的 ConstraintValidator 类：

堆栈跟踪：

我也尝试添加一个空的ctor，但是所有的服务都没有自动装配并且有一个空值。

我看到了这个问题，但它对我没有帮助

我正在尝试制作一个 Selenium 测试脚本，用于检查在提交包含错误值的表单时是否出现引导验证弹出框。

我下面的脚本返回此错误：

相关代码：

当我检查表单字段时，我看到idequals amount，为什么我无法在 Selenium 中找到这个元素？

关于 SO 的相关问题

编辑 这是我为简洁起见省略的完整脚本：

完整的 HTML：