What's the preferred way to show server side validation messages

[Marcel Ring]

Hello!

We have server side validation in our code and now my question is how I should show them on e.g. a textbox.
Currently I found a way of just rendering a div below the textbox with class e-error and the messages in it.

What is the intended way of doing this?
I would somehow prefer that the textbox component checks the control for errors (as I add them programmatically) and shows them.

Or the other way would be to allow custom content inside ejs-textbox which renders just after the textbox, so I can inject formControlName in a custom directive.

I'm just unhappy that I need to write "lastname" multiple times.

Example code of my current solution:

error.error.violations.forEach(violation => {
  const validationErrors: ValidationErrors = {};
  validationErrors[violation.message] = true;
  contactForm.controls[violation.field].setErrors(validationErrors);
})

<ejs-textbox placeholder="Last Name" floatLabelType="Auto" formControlName="lastname"
             [cssClass]="validation.determineValidationClass(contactForm,'lastname')"></ejs-textbox>
​<div class="e-error" *ngIf="hasError(contactForm, 'lastname')">
​  {{ getErrorMessage(contactForm, 'lastname') }}
​</div>

[Berly Christopher]

Hi Marcel, 

  

Greetings from Syncfusion support. 

  

We have checked the reported issue, but we can achieve the requested requirement with help of Syncfusion form validators as mentioned below documentation.  

  

UG Link: https://ej2.syncfusion.com/angular/documentation/common/reactive-form-validation/#creating-angular-reactive-form-with-syncfusion-angular-ui-validator  

  

Sample Link: https://stackblitz.com/edit/angular-51kugh?file=app.component.ts  

  

Kindly refer the details and get back to us If you need further assistance on this. 

  

Regards, 

Berly B.C 

[Marcel Ring]

Hi Christopher,

Your links describe frontend validation (form validators), but I have backend validation messages which I want to show below their corresponding control.

But as I see from frontend validation I need to manually add a div with e-error class to show the messages and thats it, right?

My preferred solution would be:

The textbox reads the errors from its connected control, shows them automagically and also renders the e-error class to highlight itself.

Is this a valid feature request, if it doesn't exist this way?

[Berly Christopher]

Hi Marcel Ring, 

  

Thanks for sharing information. 

  

We would like to inform you that, if you want to done server-side validation in the Angular platform, we need to create the element for showcasing the error message and display the error message with interpolation which is received from the server. Please find the more details from the below stack overflow link. 

  

https://stackoverflow.com/questions/57747379/how-to-do-and-show-server-validation-errors-in-angular-formsn 

  

Also, please specify which platform backend is being used for error messages or issue reproducing sample that will help us to check and proceed further from our end. 

  

Regards, 

Berly B.C