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

FormField displaying multiple error messages

1 Answer 1165 Views
Forms
This is a migrated thread and some comments may be shown as answers.
Arthur
Top achievements
Rank 1
Veteran
Arthur asked on 04 Mar 2021, 09:56 AM

Hi,

I would like to use the FormField component but for now it is not possible due a missing feature.

I would like to display multiple error messages for a FormField, something like:

```

<kendo-formfield>

    <kendo-label [for]="firstName" text="First Name"></kendo-label>

    <input formControlName="firstName" kendoTextBox #firstName required/>

    <kendo-formhint>Your first name</kendo-formhint>

 

    <kendo-formerror error="required">Error: First name is required</kendo-formerror> <=== Only shown if this specific error occures

    <kendo-formerror error="min">Error: First name is to short</kendo-formerror> <=== Only shown if this specific error occures

</kendo-formfield>

```

Is there a possibility to show multiple error messages or

are there any plans to extend the FormField component to support this?

 

Maybe using a template for error messages would be also a good idea,

to pass some data to the message which then can be used in the message itself, something like:

```

<kendo-formfield>
    <kendo-label [for]="firstName" text="First Name"></kendo-label>
    <input formControlName="firstName" kendoTextBox #firstName required/>
    <kendo-formhint>Your first name</kendo-formhint>

    <ng-template kendoFormError error="required">Error: First name is required</ng-template>
    <ng-template kendoFormError error="min" let-errorData>

        Error: First name is to short, it should have a length of at least {{errorData.min}} characters

    </ng-template>
</kendo-formfield>

```

 

1 Answer, 1 is accepted

Sort by
0
Accepted
Georgi
Telerik team
answered on 08 Mar 2021, 08:12 AM

Hi Arthur,

Thank you for getting in touch and for providing explanation and details about this issue.

You could display multiple form errors by using multiple <kendo-formerror> components as demonstrated in this demo.

Regarding error details, one possible solution is to access them from the FormControl or from fields on your component class. Both are also demonstrated in the example above.

I hope that was helpful. Please do let me know if I can assist you any further on this issue.

Regards,
Georgi
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
Forms
Asked by
Arthur
Top achievements
Rank 1
Veteran
Answers by
Georgi
Telerik team
Share this question
or