meteor autoform required validation not working with nested schema - meteor

Below is my nested schema. name.first is required. but when I submit the form it not validating, it allows empty string. did I missed anything? or How to fix this issue?
Schema.UserProfile = new SimpleSchema({
'name.first': {
type: String,
max: 50,
label: "First name"
},
'name.last': {
type: String,
optional: true,
max: 50,
label: "Last name"
}
});
Schema.User = new SimpleSchema({
profile: {
type: Schema.UserProfile,
optional: true
},
});
Meteor.users.attachSchema(Schema.User);
form:
{{#autoForm id="profile" type="method-update" meteormethod="updateProfile" schema=userSchema doc=currentUser collection=Users}}
{{> afQuickField name="profile.name.first" autofocus='' formgroup-class="col-xs-6"}}
{{> afQuickField name="profile.name.last" formgroup-class="col-xs-6"}}
{{/autoForm}}

I have checked your schema
Schema is looking good but you will have add object for the name.
Schema.UserProfile = new SimpleSchema({
'name': {
type: Object,
optional: false
},
'name.first': {
type: String,
max: 50,
label: "First name"
},
'name.last': {
type: String,
optional: true,
max: 50,
label: "Last name"
}
});

Related

Meteor - get field value with Autoform and Collection2

I have the following schema:
GuestSchema = new SimpleSchema({
name: {
type: String,
label: 'Name'
}
code: {
type: String,
label: 'Code',
autoValue: function(){
return AutoForm.getFieldValue('name', 'insertGuestForm');
},
autoform: {
type: 'hidden'
}
}
});
<template name="NewGuest">
<div class="new-guest">
{{> quickForm collection="Guests" id="insertGuestForm" type="insert" class="new-guest-form"}}
</div>
</template>
but AutoForm.getFieldValue isn't working as expected. I want to get the field value of name and save it with the property code in my DB.
ok, I have to use this.field("name");
GuestSchema = new SimpleSchema({
name: {
type: String,
label: 'Name'
}
code: {
type: String,
label: 'Code',
autoValue: function(){
var content = this.field("name");
return content.value;
},
autoform: {
type: 'hidden'
}
}
});

Meteor: Set autoValue of field to anther profiles usersId

I'm new to Meteor and programming, if this doesn't make sense or you need more info please let me know.
I'm loading a profile page of another user. So I have 2 userIds; this.userId and the other users Id. I want to use autoValue to save both userIds when an action is taken. I can't figure out how to set the other users id even though I can display it on the html page.
Path: schema.js
Schemas.class = new SimpleSchema({
Title: {
type: String,
optional: true
},
teacherProfile: {
type: String,
optional: true,
autoValue: function() {
return this.userId
},
autoform: {
type: "hidden"
}
},
studentProfileId: {
type: String,
optional: true,
type: String,
autoform: {
defaultValue: "studentProfileId",
type: "hidden"
}
}
});
Path: profile.js
Template.teacherProfile.helpers({
studentProfile: ()=> {
var id = FlowRouter.getParam('id');
return Meteor.users.findOne({_id: id});
}
});
This is my solution it seems to work. Thanks to everyone that helped.
Path: schema.js
Schemas.class = new SimpleSchema({
Title: {
type: String,
optional: true
},
teacherProfile: {
type: String,
optional: true,
autoValue: function() {
return this.userId
},
autoform: {
type: "hidden"
}
},
studentProfileId: {
type: String,
optional: true,
autoform: {
type: "hidden"
}
}
});
Path: profile.js
Template.profile.helpers({
studentProfile: ()=> {
var id = FlowRouter.getParam('id');
return Meteor.users.findOne({_id: id});
},
studentProfileId: () => {
return FlowRouter.getParam('id');
}
)};
Path: profile.html
<template name="profile">
{{#autoForm collection="Jobs" id="Offer" type="insert"}}
{{> afQuickField name='Title'}}
{{> afQuickField name='studentUserId' value=studentProfileId}}
<button type="submit" class="btn btn-primary">Insert</button>
{{/autoForm}}
</template>

use autoform to create user register form

I used below schema with autoform but my form not shown and return error. How to fix my form based on schema to create user and profile with one form in meteor-autoform.
I was created a schema based on this example.
Schema:
UserProfile = new SimpleSchema({
name: {
type: String,
label: "Name"
},
family: {
type: String,
label: "Family"
},
address: {
type: String,
label: "Address",
optional: true,
max: 1000
},
workAddress: {
type: String,
label: "WorkAddress",
optional: true,
max: 1000
},
phoneNumber: {
type: Number,
label: "Phone Number",
optional: true
},
mobileNumber: {
type: Number,
label: "Phone Number"
},
birthday: {
type: Date,
optional: true
},
gender: {
type: String,
allowedValues: ['Male', 'Female'],
optional: true
},
description: {
type: String,
label: "Description",
optional: true,
max: 1000
}
});
User = new SimpleSchema({
username: {
type: String,
regEx: /^[a-z0-9A-Z_]{3,15}$/
},
emails: {
type: [Object],
// this must be optional if you also use other login services like facebook,
// but if you use only accounts-password, then it can be required
optional: true
},
"emails.$.address": {
type: String,
regEx: SimpleSchema.RegEx.Email
},
"emails.$.verified": {
type: Boolean
},
createdAt: {
type: Date,
optional: true
},
profile: {
type: UserProfile,
optional: true
},
// // Add `roles` to your schema if you use the meteor-roles package.
// // Option 1: Object type
// // If you specify that type as Object, you must also specify the
// // `Roles.GLOBAL_GROUP` group whenever you add a user to a role.
// // Example:
// // Roles.addUsersToRoles(userId, ["admin"], Roles.GLOBAL_GROUP);
// // You can't mix and match adding with and without a group since
// // you will fail validation in some cases.
// roles: {
// type: Object,
// optional: true,
// blackbox: true
// }
// // Option 2: [String] type
// // If you are sure you will never need to use role groups, then
// // you can specify [String] as the type
roles: {
type: [String],
optional: true
}
});
And also this is my autoform code:
<template name="addUser">
{{#autoForm schema=User type="method" meteormethod="addUser" id="addUserForm"}}
<fieldset>
<legend>add user</legend>
{{> afQuickField name='username'}}
{{> afQuickField name='emails[0].address'}}
{{> afQuickField name='profile.name'}}
{{> afQuickField name='profile.family'}}
{{> afQuickField name='profile.address'}}
{{> afQuickField name='profile.workAddress'}}
{{> afQuickField name='profile.phoneNumber'}}
{{> afQuickField name='profile.mobileNumber'}}
{{> afQuickField name='profile.birthday'}}
{{> afQuickField name='profile.gender'}}
{{> afQuickField name='profile.description'}}
{{> afQuickField name='roles' type="select" options=rolesTypeOptions}}
</fieldset>
<button type="submit" class="btn btn-primary">register</button>
{{/autoForm}}
</template>
How to fix my form to create user with some profile field in one form?
Thanks for your attention.
When using Autoform schema option, you need to make sure the schema you are referring to is defined in the scope. The reason your schema is not being displayed is maybe you didn't register a helper for your User schema. Try to put the following line under the schema definition you pasted:
if (Meteor.isClient) {
Template.registerHelper('User', User)
}
Also, a good reflex to have is to enable Autoform & SimpleSchema debug mode when developping your app & forms:
if (Meteor.isClient)
AutoForm.debug()
SimpleSchema.debug = true
in any development.js file you might have to define your development environment in your app.

How should I insert into Meteor collection using autoform/collection2?

I'm trying to do the autoform books example using Meteor. How exactly should I do the Books.insert ?
I see the example:
Books.insert({title: "Ulysses", author: "James Joyce"}, function(error, result) {
//The insert will fail, error will be set,
//and result will be undefined or false because "copies" is required.
//
//The list of errors is available on
//`error.invalidKeys` or by calling
Books.simpleSchema().namedContext().invalidKeys()
});
I'm not entirely sure how I should hook this up with the rest of my code:
if (Meteor.isClient) {
Books = new Meteor.Collection("books");
var Schemas = {};
Schemas.Book = new SimpleSchema({
title: {
type: String,
label: "Title",
max: 200,
optional: true
},
author: {
type: String,
label: "Author",
optional: true
},
copies: {
type: Number,
label: "Number of copies",
min: 0,
optional: true
},
lastCheckedOut: {
type: Date,
label: "Last date this book was checked out",
optional: true
},
summary: {
type: String,
label: "Brief summary",
optional: true,
max: 1000
}
});
Books.attachSchema(Schemas.Book);
}
Can anyone give me any advice on this?
I'm thinking that I would need something like this:
Template.bookform.events({
'click btn.submit': function () {
var form = document.getElementById("formID").value;
Books.insert(form);
}
});
Thanks in advance! :)
I have never used autoform but in the documentation it says that it already gives you "automatic insert and update events, and automatic reactive validation".
So there should be no need to specify your own event handler.
In the docs you will also find the books example. I am just copying from there:
JS
Books = new Meteor.Collection("books", {
schema: {
title: {
type: String,
label: "Title",
max: 200
},
author: {
type: String,
label: "Author"
},
copies: {
type: Number,
label: "Number of copies",
min: 0
},
lastCheckedOut: {
type: Date,
label: "Last date this book was checked out",
optional: true
},
summary: {
type: String,
label: "Brief summary",
optional: true,
max: 1000
}
}
});
if (Meteor.isClient) {
Meteor.subscribe("books");
}
if (Meteor.isServer) {
Meteor.publish("books", function () {
return Books.find();
});
}
HTML
<head>
<title>Book example</title>
</head>
<body>
{{> insertBookForm}}
</body>
<template name="insertBookForm">
{{> quickForm collection="Books" id="insertBookForm" type="insert"}}
</template>

Cannot read property 'blackbox' of undefined - AutoForm and Meteor

Here's my schema:
TestCollection = new Meteor.Collection('test_collection');
var Schemas = {};
Schemas.TestCollection = new SimpleSchema({
servicesSelected: {
type: [Object]
},
"servicesSelected.0.selected" : {
type: Boolean,
optional: false
},
"servicesSelected.0.sku" : {
type: String,
optional: true
},
"servicesSelected.0.title" : {
type: String,
optional: true
},
"servicesSelected.0.price": {
type: Number,
optional: true
},
"servicesSelected.1.selected" : {
type: Boolean,
optional: false
},
"servicesSelected.1.sku" : {
type: String,
optional: true
},
"servicesSelected.1.title" : {
type: String,
optional: true
},
"servicesSelected.1.price": {
type: Number,
optional: true
}
});
TestCollection.attachSchema(Schemas.TestCollection);
My Template:
<template name="test">
{{#autoForm validation="keyup" collection="TestCollection" id="order-submission-test-form" type="insert"}}
<h1>Doing everything manually and specifying the data-schema-key:</h1>
<input type="checkbox" name="servicesSelected.0.selected" data-schema-key="servicesSelected.0.selected">
<label>HDR Photos</label>
<input type="checkbox" name="servicesSelected.1.selected" data-schema-key="servicesSelected.1.selected">
<label>Panos</label>
{{/autoForm}}
</template>
Whenever I click on the checkbox or try to validate the form I get a Cannot read property 'blackbox' of undefined error in the console. What am I doing wrong?
servicesSelected is supposed to be an array that contains hash tables on each index.
So something like:
serviceSelected = [
{
selected: true,
sku: "123",
title: "title1",
price: 100
},
{
selected: false,
sku: "124",
title: "title2",
price: 150
}
]
Just had the same issue, I would try getting rid of all numbers within your sub-object definitions. So I would try doing "servicesSelected.$.selected" instead of "servicesSelected.0.selected".
Worked for me, hopefully it works for anyone else with this strange issue.

Resources