include own validation about core HOT 18 CLOSED

Hi @geritol,
at the moment it is possible to specify different things (including a regular expression) which are then automatically used for field validation.

Lets have a look at
https://github.com/splendido/accounts-templates-core#fields
and
https://github.com/splendido/accounts-templates-core/blob/master/lib/core.js#L75

..but I might haven't understood your point. Are you thinking at something different?

from core.

I have a server method to validate phone number (validateNumbe which returns true if input is valid, false if not).
so can i do this:
re: Meteor.call('validateNumber', number)

from core.

well, re is supposed to be a regular expression, so I'm not sure it will work.
This is where re is possibly evaluated:
https://github.com/splendido/accounts-templates-core/blob/master/lib/core.js#L252

But we can think about a more general field named like 'validation' :-) which can be either a function or a regular expression. I guess a simple type check on the parameter value would do the job.

This could be also interesting for the ongoing discussion #34

from core.

yes would be great! (thats why i wrote val: true in my first comment)

Update: it should also have to be reactive, and be able to get form data.

from core.

for the reactivity there is a tentative continuousValidation configuration option.

But it needs more care because it seems some browser get stuck when validating long string at any new character...
https://github.com/splendido/accounts-templates-core/blob/master/lib/atInput.js#L46

from core.

I've added another field called func to preserve backward compatibility.
So now you have both re and func to be possibly used for custom validation.

For example, the following code adds a field called 'name' for which the only allowed value is "Full Name"

AccountsTemplates.addField({
    name: 'name',
    type: 'text',
    displayName: "Name",
    func: function(value){return value === 'Full Name';},
    errStr: 'Only "Full Name" allowed!',
});

from core.

@splendido for me it trows error even if my function returns true..
can this be?

from core.

mmm, this is where I call it:

https://github.com/splendido/accounts-templates-core/blob/master/lib/core.js#L236

and the example above worked fine.
Have you tried some debug?

from core.

nope, i am not good at debugging, but tried your code and it works the same as my code (even if returned true, it show invalid state)

from core.

do you have a public repo for your code?
My official test seems working: http://accounts-templates-bootstrap.meteor.com
you can find the code here: https://github.com/splendido/test-accounts-templates-bootstrap

from core.

i do not have a public repo, but here is my code:

//shared
AccountsTemplates.addField({
    name: 'phone',
    type: 'tel',
    displayName: "Phone",
    required: true,
    func: function(val){
        Meteor.call('phoneInfo', val, function (error, result) {
            if (error) {
                console.log(error.reason);
            } else {
                if (result === '1') {
                    console.log('nope');
                    return false;
                } else {
                    console.log('true');
                    return true;
                }
            }});
    },
    errStr: 'Invalid Phone number!',
});

//on server
var phone = Meteor.require('phone'); //phone npm package v. 1.0.2

Meteor.methods({
    phoneInfo: function (number) {
        console.log(number)
        var x = phone(number, '');
        console.log(x);
        if (x.length < 1) {
            return '1';
        } else {
            return x;
        }
    },
})

from core.

In this case, I think the problem is about calling the method.
The call itself is non-blocking, so I guess its return value is taken as the validation result.
While the return value inside the callback is not returned to AT.

I'm not sure method calls could be made blocking...
Lets have a look at the documentation: http://docs.meteor.com/#meteor_call

In particular: If you include a callback function as the last argument (which can't be an argument to the method, since functions aren't serializable), the method will run asynchronously: it will return nothing in particular and will not throw an exception.

Perhaps not giving the callback?

from core.

rewrote it, so the server function itself returns true/false.
When the validation is called the call is not yet executed, so it returns undefined.

from core.

So i think thats why it would be great to check the return of func assincronusly, and not just sincronusly after submission.

from core.

mmm, wait!
The thing is that you don't need to call a method.

AccountsTemplates.addField({
    name: 'phone',
    type: 'tel',
    displayName: "Phone",
    required: true,
    func: function (number) {
        console.log(number)
        var x = phone(number, '');
        console.log(x);
        if (x.length < 1) {
            return false;
        } else {
            return true;
        }
    },
    errStr: 'Invalid Phone number!',
});

I think this (I've not tested it, lets check it!) is all you need.

Actually it is AT that uses it both on the client and on the server.
When you submit a form it does more or less what you were trying to do. Validation are checked a second time server-side and in case something is wrong an error is passed back to the client and displayed as feed-back for the inputs involved.

Hope this helps!

from core.

I have already tried it and in it says (if i remember well) that the phone variable is not declared. So i also tryed to move my var declaration to the shared file but it also fails. Now what i am doing is declaring the validation separatly (on blur field) and passing true/false in a session variable. But since the output of func is checked sincrosusly the validation state is passed only after the event is fired twice.

from core.

I've never used npm, but actually it seems that required packages are not available on the client side.

While we think whether it is possible to write some asynchronous validation, I've tested the following code:

AccountsTemplates.addField({
    name: 'phone',
    type: 'tel',
    displayName: "Phone",
    required: true,
    func: function (number) {
        if (Meteor.isServer){
            var x = phone(number, '');
            if (!x || x.length < 1)
                return false;
        }
        return true;
    },
    errStr: 'Invalid Phone number!',
});

which works. This means no error is given until you press the Register button. But then if the number is not correct you get the error.

Another way, more tricky, would be setting by hand the error inside the asynchronous callback, like this:

if (Meteor.isServer){
    var phone = Meteor.require('phone'); //phone npm package v. 1.0.2
    Meteor.methods({
        phoneInfo: function (number) {
            console.log(number);
            var x = phone(number, '');
            console.log(x);
            if (!x || x.length < 1) {
                return '1';
            } else {
                return x;
            }
        },
    });
}

AccountsTemplates.addField({
    name: 'phone',
    type: 'tel',
    displayName: "Phone",
    required: true,
    func: function(val){
        Meteor.call('phoneInfo', val, function (error, result) {
            if (error) {
                console.log(error.reason);
            } else {
                if (result === '1') {
                    console.log('nope');
                    AccountsTemplates.setFieldError('phone', 'Invalid Phone number!');
                } else {
                    console.log('true');
                }
            }});
        return true;
    },
    errStr: 'Invalid Phone number!',
});

I've elaborated on your code, and it seems to work.
Let me know!

Btw, asynchronous validation could be a good point to consider! Thanks

from core.

Used the above examples inside the documentation.
See df64d06.

from core.