Aurelia validation cannot read property __rules__

Help Requests
1

I’m trying to implement Aurelia validation, but I’m strugling to find any decent and recent example. The docs are good in describing how the validation work and should be setup, but its missing proper example.

“aurelia-validation”: “^1.5.0”,

I have a simple model (customer.model.ts):

import { ValidationRules } from 'aurelia-validation';

export interface ICustomer {
  name: string;
  email: string;
}

ValidationRules
  .ensure((x: ICustomer) => x.number).required()
  .ensure((x: ICustomer) => x.name).required()
  .ensure((x: ICustomer) => x.shortName).required()

in my view (customer-editor.ts):

...
import { ValidationController,  validateTrigger } from 'aurelia-validation';

public customer: ICustomer = ({ name: 'One'} as ICustomer);

constructor(private validationCtrl: ValidationController) {
  this.validationCtrl.validateTrigger = validateTrigger.manual;
}

onSubmit() {
  this.validationCtrl.validate();
}

When I hit onSubmit, I get an error:

Possible Unhandled Promise Rejection: TypeError: Cannot read property '__rules__' of undefined

I have tried (with no success) moving to rules to customer-editor.ts constructor and adding

.on(this);
// .on(this.customer);

Also using class instead of interface makes no difference.

Any ideas what am I doing wrong? Thank you!

P.S. I 've also asked this on StackOverflow, but no luck. (https://stackoverflow.com/q/58450143/1861354)

1 Like
2

This is just a guess but are you using @inject or @autoinject on the CustomerEditor class to inject the ValidationController in the constructor?
Validation Controller

1 Like
3

no, @autoinject is there …

1 Like
4

Check for duplicate aurelia-validation folders in node_modules

1 Like
5

I have searched the node_modules as well as re-installed all, but still the same problem …

1 Like
6

Also check for duplicate aurelia-templating and aurelia-binding… Run npm ddp

1 Like
7

Thank you, not sure if this worked, but after running npm ddp, I have converter interface to class and created an instance of model on page load, but still no luck. Then I have changed Validation rules to

.on(ICustomer)

and it suddenly worked.
To simply use .rules did not work for me neitehr using an iterface… This is how it look like now:

import { ValidationRules } from 'aurelia-validation';

export class Customer {
  name: string;
  email: string;
  short: string;
}

ValidationRules
  .ensure((x: Customer) => x.number).required()
  .ensure((x: Customer) => x.name).required()
  .ensure((x: Customer) => x.shortName).required()
  .on(Customer)
  // .rules this wont work ... not sure why

and controller

...
import { ValidationController,  validateTrigger } from 'aurelia-validation';
...

public customer: Customer = new Customer()

constructor(private validationCtrl: ValidationController) {
  this.validationCtrl.validateTrigger = validateTrigger.manual;
}

onSubmit() {
  this.validationCtrl.validate();
}
1 Like
8

You need to save rules to a variable and later add an object to the controller along with rules.
If you don’t do that the validate binding behaviour has no idea what the rules are for a field.

See how it’s done here https://aurelia.io/docs/plugins/validation#multiple-validation-controllers

1 Like
9

thank you! I can see that someone has made documentation clearer on this point.

1 Like