ValidationSummary和ValidationMessageFor,当没有出现错误时显示自定义CSS

前端之家收集整理的这篇文章主要介绍了ValidationSummary和ValidationMessageFor,当没有出现错误时显示自定义CSS前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
一旦我将自定义CSS应用于ValidationSummary和ValidationMessage,即使没有错误也会显示页面上. CSS确实有一个图像.

当没有错误时,如何隐藏摘要错误

  1. @Html.ValidationSummary("",new { @class = "required" })
  2. @Html.ValidationMessageFor(m => m.UserName,null,new { @class = "required" })
  3.  
  4.  
  5. .required {
  6. background-image: url(/images/required.jpg);
  7. background-repeat: no-repeat;
  8. height: 33px;
  9. width: 386px;
  10. font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;
  11. font-size: 13px;
  12. font-weight: bold;
  13. color: #1eb4ec;
  14. padding-top: 16px;
  15. padding-left: 54px;
  16. margin-left: 30px;
  17. }

解决方法

这些已经建立在css类型中:
  1. /* Styles for validation helpers
  2. -----------------------------------------------------------*/
  3. .field-validation-error {
  4. color: #ff0000;
  5. }
  6.  
  7. .field-validation-valid {
  8. display: none;
  9. }
  10.  
  11. .input-validation-error {
  12. border: 1px solid #ff0000;
  13. background-color: #ffeeee;
  14. }
  15.  
  16. .validation-summary-errors {
  17. font-weight: bold;
  18. color: #ff0000;
  19. }
  20.  
  21. .validation-summary-valid {
  22. display: none;
  23. }

在MVC3项目的默认css文件中.这些是根据ModelState是否具有指定的属性或ValidationSummary所有的任何错误而适当显示的.如果ModelState中没有错误,那么display:none;来自.field-validation-valid将隐藏错误.

猜你在找的CSS相关文章