Aurelia validation error "Error: Unable to parse accessor function: function (c) { return c.client.clientLastName; }"

Help Requests
1

I have asked a very similar question about this on SO here.

Aurelia validation works for a simple bind where I might have a single variable in the view model and then access that in the view like so:

<input type="password" value.bind="password & validate" class="form-control" id="password" placeholder="Password">

and in the view model:

ValidationRules.ensure((v: Login) => v.username)
.displayName("User Name")
.required()
.on(Login);

This works at the moment and I get an error if I fail to enter anything and tab out. Great…

If on the other hand I am instead using an object variable set to an interface eg: client: ClientDetails; in my view-model.

export class Client {
controller: ValidationController;
client: ClientDetails;
 ...

where the view has it showing:

<input type="text" value.bind="client.clientLastName & validate" class="form-control" id="lastname" placeholder="Last Name...">

and I set the validation rules like so:

ValidationRules.ensure((c:Client) => c.client.clientLastName)
.displayName("Last name")
.required()
.on(Client);

I get the following error:

Error: Unable to parse accessor function: function (c) { return c.client.clientLastName; }

“client” here is set to an interface type… clientLastName is one of a number of members of this object variable.

How do I handle the syntax when all the inputs are bound to variables that are part of a larger object?

2

So is this a limitation of Aurelia validation? It only works on basic variables and not on elements of an object…

It works on a simple variable on the same page but not on a variable that is part of a larger object set to an interface…

3

Not 100% sure, but the expression (c:Client) => c.client.clientLastName) may be wrong.
c is already a Client instance, so I guess it should be: (c:Client) => c.clientLastName)

Hope this helps.

4

Thanks for replying. I tried that and its underlining "clientLastName in red unfortunately.

validation
validation.png767×368 17.7 KB

5

If I understand your problem and the documentation correctly (haven’t done much with the validation before):
You can assign rules to classes and instances via .on(...) Because interfaces only are used in TypeScript and don’t exist in plain JS Aurelia can’t find the proper ValidationRules for your object. Therefore you have to pass the exact instance or use a class as these stay in JS after transpilation.

6

The subproperties feature is not implemented yet.

7

The project I am working on requires complex validation on complex model. I have built a custom validation tool for it. It should cover your use case, if you are willing to have a look.

Beware it is a generic tool, doesn’t provide glue code to Aurelia component. In Aurelia app, you need to at least do (1) when model changes, run validation again to produce an error object, (2) bind the error object to your view, I mean using "error.sub.prop".