<input mdbInputDirective data-error=\"getErrorMessage()\" is-valid=\"someCustomValidations()\" ...>At the Present, I\'m using some thing like this:

<input mdbInputDirective data-error=\" \" ...>Error message and the way input validate it\'s value is unknown!

Damian Gemza staff commented 6 years ago

Dear Reza, I would advice you to use some method in which you're checking the validation status of desired input. After checking if some validation is invalid, you're changing data-error or data-success attribute dynamically by using Renderer2 class. That should work fine. Best Regards, Damian

Dear Reza, I would advice you to use some method in which you're checking the validation status of desired input. After checking if some validation is invalid, you're changing data-error or data-success attribute dynamically by using Renderer2 class. That should work fine. Best Regards, Damian

Please insert min. 15 characters.

Publish

---

Reza Assar free commented 6 years ago

Unfortunately, changing "data-error" using "Renderer2" did not worked! actually, changed value for "data-error" does not take effect. i have created a directive named "CustomValidator" and applied it to desired input control. Following code is simplified of CustomValidator: import { Directive, Renderer2, ElementRef, OnInit } from '@angular/core'; import { NgControl } from '@angular/forms'; @Directive({ selector: '[CustomValidator]' }) export class CustomValidatorDirective implements OnInit{ constructor(private renderer: Renderer2, private el: ElementRef, private control : NgControl) { } ngOnInit(){ this.renderer.setAttribute(this.el.nativeElement, "data-error", "Foo"); } }

Unfortunately, changing "data-error" using "Renderer2" did not worked! actually, changed value for "data-error" does not take effect. i have created a directive named "CustomValidator" and applied it to desired input control. Following code is simplified of CustomValidator: import { Directive, Renderer2, ElementRef, OnInit } from '@angular/core'; import { NgControl } from '@angular/forms'; @Directive({ selector: '[CustomValidator]' }) export class CustomValidatorDirective implements OnInit{ constructor(private renderer: Renderer2, private el: ElementRef, private control : NgControl) { } ngOnInit(){ this.renderer.setAttribute(this.el.nativeElement, "data-error", "Foo"); } }

Please insert min. 15 characters.

Publish

---

Reza Assar free commented 6 years ago

@Damian Gemza hellooooooo, Is there any other workaround?

@Damian Gemza hellooooooo, Is there any other workaround?

Please insert min. 15 characters.

Publish

---

Reza Assar free commented 6 years ago

Hello!!!!!

Hello!!!!!

Please insert min. 15 characters.

Publish

---

Dawid Adach pro commented 6 years ago

Have you checked this docs: https://mdbootstrap.com/angular/forms/input-validation/ ?

Have you checked this docs: https://mdbootstrap.com/angular/forms/input-validation/ ?

Please insert min. 15 characters.

Publish

---

Reza Assar free commented 6 years ago

Yes i have. funny thing about this link(page) is: data-error="Something went wrong..." And <div class="alert alert-danger" *ngIf="validatingForm.controls['required'].errors?.required">Custom Error</div> user expect to see either "Something went wrong..." or "Custom Error" on invalid input. but "Wrong" will shown. and it's a little confusing. I already have some custom validators and dedicated message for each. Start your code here <div [formGroup]="form"> <divclass="md-form"> <iclass="fa fa-user prefix"></i> <inputmdbInputDirective data-error=" " /////////////////////Or alternativily "wrong static message" data-success=" " class="form-control" type="text" id="username" formControlName="Username"> <labelfor="username">{{UserNameText}}</label> <!-- <div class="invalid-feedback" *ngIf="InvalidUsername"> <div *ngIf="Username.errors.required">{{MainResource?.ItemIsRequired}}</div> <div *ngIf="Username.errors.NoWhiteSpaceValidator && !Username.errors.required">{{MainResource.NoWhiteSpace}}</div> <div *ngIf="Username.errors.minlength && !Username.errors.required && !Username.errors.NoWhiteSpaceValidator">{{MainResource.MinLengthRequired}}{{Username.errors.minlength.requiredLength}}</div> <div *ngIf="Username.errors.NationalCodeValidator && !Username.errors.required && !Username.errors.NoWhiteSpaceValidator && !Username.errors.minlength">{{MainResource.InvalidNationalCode}}</div> </div> --> </div> I have already commented *ngIf alert DIVs. 1) input shows green ribbon under input meanwhile it's touched and invalid. 2) Custom message which is associated with "data-error" should be dynamically changed. Please let me know if you want any farther info and please give more robust answers (so i can understand which part of question has inadequacy).

Yes i have. funny thing about this link(page) is: data-error="Something went wrong..." And <div class="alert alert-danger" *ngIf="validatingForm.controls['required'].errors?.required">Custom Error</div> user expect to see either "Something went wrong..." or "Custom Error" on invalid input. but "Wrong" will shown. and it's a little confusing. I already have some custom validators and dedicated message for each. Start your code here <div [formGroup]="form"> <divclass="md-form"> <iclass="fa fa-user prefix"></i> <inputmdbInputDirective data-error=" " /////////////////////Or alternativily "wrong static message" data-success=" " class="form-control" type="text" id="username" formControlName="Username"> <labelfor="username">{{UserNameText}}</label> <!-- <div class="invalid-feedback" *ngIf="InvalidUsername"> <div *ngIf="Username.errors.required">{{MainResource?.ItemIsRequired}}</div> <div *ngIf="Username.errors.NoWhiteSpaceValidator && !Username.errors.required">{{MainResource.NoWhiteSpace}}</div> <div *ngIf="Username.errors.minlength && !Username.errors.required && !Username.errors.NoWhiteSpaceValidator">{{MainResource.MinLengthRequired}}{{Username.errors.minlength.requiredLength}}</div> <div *ngIf="Username.errors.NationalCodeValidator && !Username.errors.required && !Username.errors.NoWhiteSpaceValidator && !Username.errors.minlength">{{MainResource.InvalidNationalCode}}</div> </div> --> </div> I have already commented *ngIf alert DIVs. 1) input shows green ribbon under input meanwhile it's touched and invalid. 2) Custom message which is associated with "data-error" should be dynamically changed. Please let me know if you want any farther info and please give more robust answers (so i can understand which part of question has inadequacy).

Please insert min. 15 characters.

Publish

---

Reza Assar free commented 6 years ago

By the way, @Directive sample was just a sample. not practical code. It's just because of mimics how to accommodating custom message into data-error (based on your suggestion).

By the way, @Directive sample was just a sample. not practical code. It's just because of mimics how to accommodating custom message into data-error (based on your suggestion).

Please insert min. 15 characters.

Publish

---

Damian Gemza staff commented 6 years ago

Dear Reza, The problems which you're listing in a comment will be fixed with today's release. Best Regards, Damian

Dear Reza, The problems which you're listing in a comment will be fixed with today's release. Best Regards, Damian

Please insert min. 15 characters.

Publish

---