當不顯眼的驗證失敗時向元素添加自定義CSS

Question

我試圖在驗證失敗時將CSS類添加到文本框。

@Html.TextBoxFor(x => x.AdminUser.Username, new 
{ 
    @id = "Username", 
    @name = "Username", 
    @type = "text", 
    @class = "form-control", 
    @placeholder = "Kullanıcı Adı", 
    @autocomplete = "off" 
}) 
@Html.ValidationMessageFor(x => x.AdminUser.Username, null, new { @class = "text-danger text-12 pl-10" }) 

是否可以添加回調？還是呢？

解決方案對我來說：

重寫的onError類不引人注目的驗證源的JS的伎倆。現在我可以訪問上面的div元素。

if (replace) { 
     container.empty(); 
     error.removeClass("input-validation-error").appendTo(container); 
     error.closest("div").addClass("has-error"); 
    } 

Answer 1

input的將input-validation-error類時驗證失敗加入。如果添加上述style到您的網頁就會影響到所有的投入

.input-validation-error { 
    // your styles 
} 

：所以，你可以覆蓋類像這樣與你的自定義樣式。所以，如果你想針對特定的元素，你可以添加一個custom-error-message類

.custom-error-message.input-validation-error{ 
    // error styles 
} 

然後在TextBox要目標：

@Html.TextBoxFor(x => x.AdminUser.Username, new { @class = "custom-error-message form-control"}) 

現在您的自定義錯誤的風格只會被添加到那些輸入與custom-error-message類。