Question

我有多个标签的标签页。在每个选项卡中，我有许多文本字段供用户输入。标签条由表单包围，位于提交按钮下方。

我对模型属性进行了注释验证。使用Jquery验证，验证工作正常。但是，如果用户在字段中输入错误，则转到另一个选项卡并按提交，错误将显示在非活动选项卡中，因此用户不会看到。我希望Jquery验证自动转到带有验证错误的选项卡，以便用户可以看到它。这可能吗？

Answer 1

我认为没有开箱即用的解决方案。但你可以在javascript中轻松完成。你在表单上做的是提交你看每个标签的内容，如果你发现验证错误，那么你切换到那个标签。

这里是样本：

<script type="text/javascript">
    $(document).ready(function () {
        $("#myForm").submit(function () {
            $("#tabs").tabs("select", $("#myForm .input-validation-error").closest(".ui-tabs-panel").get(0).id);
        });
    });
</script>

此示例假定您的表单的ID是myForm，您的标签ID是标签。此外，它假定您在web.config中具有ClientValidationEnabled = true和UnobtrusiveJavaScriptEnabled = true。此代码段将切换到错误的第一个标签。

此代码只是示例，可以重构，但它显示了想法。

多个选项卡中的MVC表单验证 - 自动跳转到带有验证错误的选项卡？

1 个答案: