Question

我希望此div显示表单验证是否不成功。

<div class="alert">
  <strong>Warning!</strong> @Html.ValidationSummary(false, "Fix these errors:")
</div>

我试图将其包裹在

中

if(! ViewData.ModelState.IsValid)

但提交表单时不显示div。可能是因为没有回发因jquery验证。验证逻辑似乎没问题，如果我删除if语句验证摘要列表所有不正确的输入字段。

如何根据验证切换div的可见性？

Answer 1

<强>更新

我重写了接受的答案。如果服务器连接速度很慢，则在服务器请求期间将显示错误div。即使没有错误。我更改了它以检查表单在提交表单时是否有效。此代码段假设您有一个表单。

$(document).ready(function () {
    $(".alert").hide(); //hides the div on page load

    $("form").submit(function () {
        if (!$(this).valid()) {
            $('.alert').show();
        }
    });        
});

Answer 2

您可以应用此简单脚本。它不是很复杂，但它应该做的伎俩

$(document).ready(function () {
    $('.alert').hide(); //hides the div on page load
    $('#submit').click(function () {  //assumes your submit button has id="submit"
        $('.alert').show(); //shows the div when submit is clicked
    });
});

如您所见，这实际上并不关心验证。它只是在单击提交按钮时使“警报”div可见。如果存在验证错误，则div将显示警告。如果表单有效，我假设刷新或重定向，所以div实际上永远不会有机会显示。

验证失败时显示div

2 个答案: