Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
    Martin Johansson
    @kvadd
    that would be awesome
    I hope I'm wrong here :D
    check out this gist to see what I mean
    Doug Kent
    @dkent600

    @kvadd If you change this line in the gist:

    <form submit.delegate="submit()">

    to this:

    <form submit.delegate="submit()" with.bind="$parent">

    then the validation works.

    I'm not sure if this should be necessary or not.

    I added this comment to the github issue.

    Julien Enselme
    @Jenselme
    Hi, aurelia-validation, is it possible to know if the form was touched by the user? My goal is to prevent the user to submit the form until is it filled and valid. I currently check that there are no errors thanks to validation-errors.bind="errors" but when the page loads, this array is empty. This means the user can submit it right away.
    Doug Kent
    @dkent600
    @Jenselme Can you just assume that the form is not valid, at the start? You know the form has not been touched until they touch it...
    Julien Enselme
    @Jenselme
    @dkent600 how do I detect that?
    Doug Kent
    @dkent600
    When you enter into the view, on activate or bind
    @Jenselme Otherwise, you can forgo doing any validation until the user presses the submit button.
    When you create the form, you know at that point it has not been touched
    Julien Enselme
    @Jenselme
    @dkent600 I'd prefer to disable the button until the form is correct. I still fail to see how I can detect a user interacted with it: I agree that on 1st display, the user has not touched it. How do I know they did?
    Doug Kent
    @dkent600
    I assume your trigger is on blur or change, so once they have "touched" something then validation fires. (you can also, of course, handle those events yourself if you want). Thing is, what you want to know is whether the entire form is valid, and you can only know that if you validate the entire form.
    so it partly depends on exactly what you want to feed back to the user
    one thing you can do is have two controllers, or mess around with swapping renderers on a single controller, and have two validation paths, one that validates per field and displays feedback per field, and one that validates the entire object, without visual feedback, to set the disabled state on your button.
    Julien Enselme
    @Jenselme
    The two controllers may solve my problem. I am doing some tests with manual validation in attached: I can get a canSave property to false initially. My problem is: how can I detect that validation has run again to update this value and allow the user to submit the form?
    I should just reuse validation-errors.bind="errors": the array is filled correctly initially
    Doug Kent
    @dkent600

    You can make controller.errors observable, a bit of a hack IMHO, or, the currently proposed best method is to implement your own ValidationRenderer whose render method is invoked whenever validation occurs.

    There is a long unresolved discussion of this, here: aurelia/validation#318

    Feel free to add your support to implementing something there....

    Yes, you could observe your errors property
    on second thought, I'm not sure how observing the errors properties (yours or the controller's) helps you know when validation has occurred, nor in knowing whether the entire form is valid.
    may it ^^^ could help in just knowing whether validation has changed
    Julien Enselme
    @Jenselme

    You can make controller.errors observable

    I tried that without success.

    I am trying to obtain the behaviour I want with two controllers. I'll also look at the link you posted.

    Doug Kent
    @dkent600
    cool
    Doug Kent
    @dkent600
    @kvadd Sorry, make that: <div class="form-group" repeat.for="field of fields" with.bind="$parent">
    Julien Enselme
    @Jenselme
    @dkent600 I didn't manage to use two controllers but I found a work around with one controller and a validator. More details in this blog post: http://www.jujens.eu/posts/en/2017/Jan/24/aurelia-validation/
    Doug Kent
    @dkent600
    @Jenselme How do you manage to prevent the error message for the title from displaying too soon?
    Julien Enselme
    @Jenselme
    @dkent600 I do. The message is displayed by the controller (normal usage) and the button is managed by the validator.
    I doubt my solution scales thought. But for my test app with aurelia-validation it is enough. I hope we will have a better way to do this soon.
    Doug Kent
    @dkent600
    @Jenselme Since you are validating in attached, it seems like the message would show then. Also, I"m curious why you need the ol.getObserver thing. Doesn't the validator get automatically used on change or blur?
    Julien Enselme
    @Jenselme
    I use a Validator in attached. This won't display any message unlike the validate method of ValidationController. Since I need to rely on that to enable/disable my button, I have to watch if the title is changed to do a manual validation. I guess I should add these precision to my post.
    Doug Kent
    @dkent600
    @Jenselme OK, I think then your validateTrigger should be "manual". But the thing is, you are displaying titleErrors -- why isn't that showing an error message after you validate in attached?
    Julien Enselme
    @Jenselme

    Because titleErrors are managed by the ValidationController not the Validator. From the doc

    When you use a Validator directly to validate a particular object or property, there are no UI side-effects- the validation results are not sent to the the validation renderers.

    Doug Kent
    @dkent600
    @Jenselme Ah! I get it. OK, can you leave the trigger at "changeOrBlur" and remove the ol.getObserver? Then your validator would be invoked on change or blur. and you have a more scalable solution. what do you think?
    Julien Enselme
    @Jenselme

    I tried changing the code to this:

            this.validator.validateTrigger = validateTrigger.changeOrBlur;
    
            /*ol.getObserver(this.todo, 'title').subscribe(() => {
                this.validate();
            });*/

    But this has no effect: this.validator.validateObject is never called. Maybe I am missing something to correctly use trigger with Validator?

    Doug Kent
    @dkent600
    @Jenselme OK, sorry, I assumed something that wasn't happening -- I assumed you were telling the controller to use your validator. But you're not. But if you were then you'd see your validater being invoked.
    @Jenselme Try passing in your validator to controllerFactory.createForCurrentScope()
    Julien Enselme
    @Jenselme
    @dkent600 I guess it will be called yes. I tried this but without surprise my canSave property is not updated. And from the Validator interface I see no way to hook on the validation to call a cb.
    Doug Kent
    @dkent600
    @Jenselme well, I'm surprised that canSave wasn't updated unless typescript isn't getting the this right. What was the problem?
    @Jenselme oh, I get why
    @Jenselme Seems like you could create your own implementation of Validator, containing the instance of StandardValidator that you got from DI....
    Julien Enselme
    @Jenselme

    @dkent600 this could be the way! I am trying to implement it:

    class MyValidator {
        constructor(validator, cb) {
            this.validator = validator;
            this.cb = cb;
        }
    
        validateProperty(object, propertyName, rules) {
            this.validator.validateProperty(object, propertyName, rules);
        }
    
        validateObject(object, rules) {
            return this.validator.validateObject(object, rules).then(results => {
                this.cb(results);
                return results;
            });
        }
    
        ruleExists(rules, rule) {
            return this.validator(rules, rule);
        }
    }

    sadly I get a strange error:

    Uncaught (in promise) TypeError: Cannot read property 'slice' of undefined
        at ValidationController.processResultDelta (validation-controller.js:243)
        at eval (validation-controller.js:190)

    Don't see why.

    @dkent600 It's getting late. I have to go. I'll try again tomorow and keep you posted on what I find.
    Fernando Vega
    @vegafx12
    Hiya folks! Just trying out the Aurelia-Validator for the first time and I'm wondering if there's a default set of Validation messages defined somewhere in any of the .js/d.ts files? If so, I cannot find them :(
    Martin Johansson
    @kvadd
    That's an awesome catch @dkent600 I didn't know about the with.bind command. But, it's like you said, it doesn't feel like it should be necessary
    Christian Genne
    @genne
    Hi! Does the binding behavior validateOnChange work? I've tried using it but get the error "No BindingBehavior named "validateOnChange" was found!" (using the latest version)... also, can't see the code for it anywhere in GitHub?
    Fernando Vega
    @vegafx12
    @genne seems to be working okay for me... Although, I'm not calling a method...
    constructor(authService: AuthService, controller: ValidationController) {
            // Aurelia-Authentication
            this.authService = authService;
            this.authService.authenticated = false;
    
            // Aurelia-Validation
            this.controller = controller;
            this.controller.validateTrigger = validateTrigger.change;
    ....
    Christian Genne
    @genne
    @vegafx12 yes, that works for me as well! but using the binding behavior doesn't...
    Fernando Vega
    @vegafx12
    @genne What are you trying to do? I think I may be having the same (or at least similar) issue right now...
    Christian Genne
    @genne
    I need to use the change trigger for some specific elements (custom elements actually)... using the default blur event doesn't work as the custom element doesn't trigger blur correctly