验证失败时显示div

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

您可以应用这个简单的脚本。它不是很复杂，但应该可以解决问题

$(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 实际上永远不会有机会显示。