Styling the input box on validation error

[Willem]

I have the following configuration on my grid regarding validation:

<ValidationSettings EnableValidation="true" />

 

And then there are columns that have validation add like this:

<telerik:GridBoundColumn DataField="Name" HeaderText="Short Name">
    <ColumnValidationSettings EnableRequiredFieldValidation="true">
        <RequiredFieldValidator BackColor="MediumVioletRed" ErrorMessage="*" />
    </ColumnValidationSettings>
</telerik:GridBoundColumn>

 

Now, this works just fine. But this just shows a message with a red background. I want to style the input field to use the BackColor value.

Is there a good way of doing this?

[Konstantin Dikov]

Hello Willem,

I have tested the column definition that you have and the BackColor is correctly applied to the error message (the MediumVioletRed color).

On a side note, you can add custom CSS class to the span element and customize it entirely with CSS:

<RequiredFieldValidator ErrorMessage="*" CssClass="validationClass" />

.validationClass {
    background: blue;
    color: white;

}

If further assistance is needed, please share the markup of your RadGrid, so we can have a better idea of the exact scenario.



Regards,
Konstantin Dikov
Telerik by Progress

[Willem]

I know how to style the error message. I want to change the style of the related input field.

[Konstantin Dikov]

Hello Willem,

You can only change the style of the validation error message when the validation fails and there is no specific class name or indication that the INPUT element have failed the validation. You can however take a look at our online demo for server validation, which approach can be used for getting reference to the editor for which the validation failed (with a Template column and EditItemTemplate):

• http://demos.telerik.com/aspnet-ajax/grid/examples/data-editing/validation/defaultcs.aspx

Best Regards,
Konstantin Dikov
Telerik by Progress