This is a migrated thread and some comments may be shown as answers.
Custom popup editor using Bootstrap tabs - switch tabs on validation error
1 Answer 7 Views
This is a migrated thread and some comments may be shown as answers.
Mat
Top achievements
Rank 1
Mat asked on 27 Jul 2017, 08:37 AM

I've got a few custom popup grid editors that are grouping related fields using Bootstrap tabs.

I'm trying to find a way to switch tabs in the event of a validation error (using the built-in Kendo validation). At this moment, if a user has a particular tab open, and fails to complete a required field on a different tab, the save fails without any visual hints.

I've previoulsy found a solution when using jQuery validate (but I can't find it now) but I'd rather use Kendo's validation for simplicity.

Any suggestions?

1 Answer, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 31 Jul 2017, 05:56 AM
Hello James,

In this scenario, I can suggest using the validate event of the Kendo UI Validator and check if the form is valid. If the form is not valid, use a custom logic to determine which field is invalid and programmatically switch the tab to the one containing the invalid field:

http://docs.telerik.com/kendo-ui/api/javascript/ui/validator#events-validate

I hope this is helpful.

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Grid
Asked by
Mat
Top achievements
Rank 1
Answers by
Stefan
Telerik team
Share this question
or