This is a migrated thread and some comments may be shown as answers.

Grid popup: How to display validation errors inline (rather than as hint bubble)

1 Answer 91 Views
Grid
This is a migrated thread and some comments may be shown as answers.
James
Top achievements
Rank 1
James asked on 01 Dec 2020, 10:58 PM

In a grid with GridEditMode.Popup, validation errors for fields in the pop-up window appear as a hint bubble by default.

Is it possible to change the style of the validation so that errors in the pop-up window appear below the input fields (as they might for a normal html form)?

See images for example.

 

Thanks,

 

1 Answer, 1 is accepted

Sort by
0
Anton Mironov
Telerik team
answered on 04 Dec 2020, 12:12 PM

Hi James,

Thank you for the provided images.

In order to change the stylings of the validation tooltip, I would recommend using CSS rules. Here is an example:

<style>
  .k-validator-tooltip{
    background-color: transparent;
        margin-top: 0px;
  }
  .k-tooltip-content{
    color: red;
  }
  .k-edit-field{
    margin-bottom: 23px;
  }
  .k-callout{
    display: none;
  }
</style>

The complete implementation could be found in the following dojo example:

Give the approach above a try and let me know if further assistance is needed.


Kind Regards,
Anton Mironov
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Grid
Asked by
James
Top achievements
Rank 1
Answers by
Anton Mironov
Telerik team
Share this question
or