search

perak / kitchen-examples

Meteor Kitchen examples
164 stars 115 forks source link

form or field validation #53

Open anthonymanzo opened 7 years ago

anthonymanzo commented 7 years ago

Hi, I'm wondering how to implement a custom validation (unique value for a particular field) with the form or collection component. I'm guessing you have done this before, so I don't want to reinvent this process. Thanks!

anthonymanzo commented 7 years ago

Looking at the client/lib/form_utils.js I see that you have a placeholder for a custom validation callback: this.validateForm = function(formObject, validationCallback, errorCallback, submitCallback) { However, I don't see how to pass this through any of the dataview or form options. Any help?

perak commented 7 years ago

Hi Anthony, unfortunatelly no way to pass custom validation to the kitchen. But You can do something server-side: in collection.before_insert_code do your validation and throw new Meteor.Error(...) on error. On submit, error message will be shown in form header (form field will not be marked red and focused).

P.S. all issues you reported are usefull issues - "must have" features, and when I finish this marathon (visual UI designer) and started improving quality of generated code, first thing I will do is to fix issues you reported. Thank you!

anthonymanzo commented 7 years ago

Ok, I’ll try that thanks. I had actually just started messing with converting to collection2 and using simple schemas to validate everything, probably a bad idea since you’ve marked this as ‘experimental’, right?

Be well. Tony

On Apr 14, 2017, at 11:00 AM, Petar Korponaić notifications@github.com<mailto:notifications@github.com> wrote:

Hi Anthony, unfortunatelly no way to pass custom validation to the kitchen. But You can do something server-side: in collection.before_insert_code do your validation and throw new Meteor.Error(...) on error. On submit, error message will be shown in form header (form field will not be marked red and focused).

P.S. all issues you reported are usefull issues - "must have" features, and when I finish this marathon (visual UI designer) and started improving quality of generated code, first thing I will do is to fix issues you reported. Thank you!

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHubhttps://github.com/perak/kitchen-examples/issues/53#issuecomment-294203191, or mute the threadhttps://github.com/notifications/unsubscribe-auth/AH95W7e6BzJME7WD7ZeqO6mCwB7gOuibks5rv7QhgaJpZM4M9MSf.

anthonymanzo commented 7 years ago

Hi Perak, You're suggestion to use the before insert (and consequently for my use case 'update') collection hooks worked. I just put the following code in my kitchen file within the collection object: "before_insert_code":" var orgExists = Orgs.findOne({org:doc.org_short_name}); if(typeof orgExists !== 'undefined'){ throw new Meteor.Error('Error','Org Short Name: '+doc.org_short_name+' already in use.'); } else { return doc; }", "before_update_code":" var postedOrg = modifier.$set.org_short_name; console.log('Posted Org Short Name:'+postedOrg); var orgExists = Orgs.findOne( {$and:[{org_short_name:postedOrg},{_id:{$ne:doc._id}}]} ); if(typeof orgExists !== 'undefined'){ throw new Meteor.Error('Error','Org Short Name: '+postedOrg+' already in use!'); } ",

perak commented 7 years ago

Glad you solved this :+1:

I added two cards to my Trello board:

anthonymanzo commented 7 years ago

Hi, Something else related to the forms - it would be helpful to automatically add a 'required' class to the input groups having a required field. That way, you could also display a '' at the end of the label for this required field by putting in css code like this: `div.required > label:after{content:'';}`

anthonymanzo commented 7 years ago

Selecting required fields and styling those labels only without having the input and label directly adjacent is not possible with current CSS. I had to create the selector at the div level instead.