how to trigger validation before submit ? about ajsf HOT 6 CLOSED

Hi,
Did you have a solution to trigger vaidation on submit and show errors in each input separatly ? not on a single div ? like :

from ajsf.

You can try the following as used in the Demo:

TYPESCRIPT

import { JsonPointer } from 'angular6-json-schema-form';
formValidationErrors: any;

private _prettyValidationErrors (formValidationErrors: any[]): string {
  if (!formValidationErrors) { return null; }
  return formValidationErrors.reduce((a, c) => {
      const arrMessage = JsonPointer.parse(c.dataPath).reduce((aa, cc) => {
          const dd = /^\d+$/.test(cc) ? `[${cc}]` : `.${cc}`;
          return aa + dd;
      }, '');
      return `${a} ${arrMessage} ${c.message} <br>`;
  }, '');
};

validationErrors(data: any): void {
    this.formValidationErrors = data;
 }

get prettyValidationErrors() {
    return this._prettyValidationErrors(this.formValidationErrors);
 }

HTML

 <json-schema-form loadExternalAssets="true" [options]="jsonFormOptions" [schema]="schema" [framework]="selectedFramework" (validationErrors)="validationErrors($event)" >
  </json-schema-form>
 <div *ngIf="!!prettyValidationErrors" class="data-bad" [innerHTML]="prettyValidationErrors"></div>

CSS

.data-bad { background-color: #fcc; }

from ajsf.

The library already support french language See Here.
Did you try adding language="fr" like this <json-schema-form language="fr"></json-schema-form> ?

from ajsf.

Thank you, i update my question, i want to trigger validation to each field, your code put all errors in the div ;

but i want to show errors separately

from ajsf.

The library support both options. As I already told you, Did you try adding language="fr" like this <json-schema-form language="fr"></json-schema-form> ?

from ajsf.

Its ok for the language, bu it shows errors in a same div like that :

and i want them to be shown to each field separately:

from ajsf.