Background
I use Meteor to develop a web app.
I installed the following packages:
aldeed:autoform 5.3.0
aldeed:collection2 2.3.1
aldeed:autoform-select2 2.0.2
natestrauser:select2 3.5.1
zimme:select2-bootstrap3-css 1.4.6
Question
I used a select2 input box in an autoform, but after I submit the form, the input box does not reset. How do I get it to reset (i.e. clear the content)?
The initial input box:
After inserting values, which does not reset even after submit
This is the Simple Schemas definition:
Schemas.TutorialSession = new SimpleSchema({
students: {
type: [Number],
label: "Students",
autoform: {
type: "select2",
afFieldInput: {
multiple: true
},
options: function() {
return [{
label: "Student1",
value: 111
}, {
label: "Student2",
value: 222
}, {
label: "2015",
value: 333
}];
}
}
}
})
Related
I have a Meteor method which does an API call, then the response of the call is saved to the users collection. I'm using the Collection2 package with my project and I'm a little bit lost setting up my SimpleSchema for this.
Here is what the JSON response looks like from the API call:
[{"keyword":"2i","url":"http://example.com","title":"Example","timestamp":"2016-11-05
08:54:42","ip":"00.00.00.000","clicks":"2","user":"HweoSCY2ujscjJ9Zl"},{"keyword":"2j","url":"http://example.com","title":"YouTube","timestamp":"2016-11-06
02:11:18","ip":"00.00.00.000","clicks":"1","user":"HweoSCY2ujscjJ9Zl"},{"keyword":"2k","url":"http://example.com","title":"YouTube","timestamp":"2016-11-08
03:35:12","ip":"00.00.00.000","clicks":"0","user":"HweoSCY2ujscjJ9Zl"}]
Here's currently how I've been able to save this data to the users collection:
Meteor.users.update(Meteor.userId(), {
$set: { 'shortURLs.URLS': result.data }
});
This works and looks like this in the db:
My issue is that I'd like to have a SimpleSchema setup for this so that the "timestamp" will be saved as a Date instead of a String, but everytime I try and create a schema for it I just receive errors like "After filtering out keys not in the schema, your modifier is now empty". I have tried a lot of different variations to try and make it work but none of them have been successful, here's just currently where it's at:
Schema.ShortURLs = new SimpleSchema({
shortURLs: {
type: Object
},
'shortURLs.$': {
type: Object
},
'shortURLs.$.keyword': {
type: String,
optional: true,
label: "Keyword"
},
'shortURLs.$.url': {
type: String,
optional: true,
label: "URL"
},
'shortURLs.$.title': {
type: String,
optional: true,
label: "Title"
},
'shortURLs.$.timestamp': {
type: Date,
optional: true,
label: "Timestamp"
},
'shortURLs.$.ip': {
type: String,
optional: true,
label: "IP"
},
'shortURLs.$.clicks': {
type: String,
optional: true,
label: "Clicks"
},
'shortURLs.$.user': {
type: String,
optional: true,
label: "User"
},
});
This is then attached apart of a User Simple Schema:
...
shortURLs: {
type: Schema.ShortURLs,
optional: true
},
...
And I have that attached to the users collection:
Meteor.users.attachSchema(Schema.User);
I don't think there's an issue with how I have it attached as I have other SimpleSchemas setup the same way and they're working fine, I believe the issue is how I have this particular one written. Any help here would be extremely appreciated.
You need to define the shortURLs type in the Meteor.users collection as type: [Schema.ShortURLs], i.e. a list of type Schema.ShortURLs
Schema = {}
Schema.ShortURLs = new SimpleSchema({
keyword: {
type: String,
optional: true,
label: "Keyword"
},
url: {
type: String,
optional: true,
label: "URL"
},
title: {
type: String,
optional: true,
label: "Title"
},
timestamp: {
type: Date,
optional: true,
label: "Timestamp"
},
ip: {
type: String,
optional: true,
label: "IP"
},
clicks: {
type: String,
optional: true,
label: "Clicks"
},
user: {
type: String,
optional: true,
label: "User"
},
});
Schema.User = new SimpleSchema({
...
shortURLs: {
type: [Schema.ShortURLs],
optional: true
},
...
});
...
Meteor.users.attachSchema(Schema.User);
I might be thinking about this the wrong way, so please feel free to correct my thinking.
I'm using simpleSchema and I have a section of code which is used in more than one schema. Is there a way to create an individual component and import it into each schema, so that when I need to update the component I don't have to update it in multiple locations?
Path: resuableComponent
type: String,
optional: true,
autoform: {
type: "select",
options: function () {
return [
{label: "School logo 1", value: 'url'},
{label: "School logo 2", value: 'url'},
{label: "School logo 3", value: 'url'},
];
},
}
Path: studentCollection.js
Schemas.Student = new SimpleSchema({
studentUserId: {
type: String,
},
school: {
type: String,
optional: false
},
**resuableComponent**
});
Path: teacherCollection.js
Schemas.Teacher = new SimpleSchema({
teacherUserId: {
type: String,
},
school: {
type: String,
optional: false
},
**resuableComponent**
});
You could move the reusable objects into a different file that should be visible on both client and server if you are using SimpleSchema.
Example based on your question:
lib/schema-components.js :
SchemaComponents = {
school: {
type: String,
optional: false
},
// ...
// more reusable components here
};
someCollectionFile.js :
Schemas.Student = new SimpleSchema({
studentUserId: {
type: String
},
school: SchemaComponents.school,
// ...
});
Here is my method:
removeRole: function(role) {
check(role, String);
var user = Meteor.user();
if (!user || ! AccountsAdmin.checkForAdminAuthentication(user))
throw new Meteor.Error(401, "You need to be an authenticated admin");
// handle non-existing role
if (Meteor.roles.find({name: role}).count() < 1 )
throw new Meteor.Error(422, 'Role ' + role + ' does not exist.');
if (role === 'admin')
throw new Meteor.Error(422, 'Cannot delete role admin');
// remove the role from all users who currently have the role
// if successfull remove the role
Meteor.users.update(
{roles: role },
{$pull: {roles: role }},
{multi: true},
function(error) {
if (error) {
throw new Meteor.Error(422, error);
} else {
Roles.deleteRole(role);
}
}
);
},
Here is the error I receive when looking at the call in Kadira:
message: After filtering out keys not in the schema, your modifier is now empty
stack:
Error: After filtering out keys not in the schema, your modifier is now empty
at [object Object].doValidate (packages/aldeed_collection2-core/lib/collection2.js:282:1)
at [object Object]._.each.Mongo.Collection.(anonymous function) [as update] (packages/aldeed_collection2-core/lib/collection2.js:83:1)
at [object Object].Meteor.methods.removeRole (packages/accounts-admin-ui-bootstrap-3/server/methods.js:86:1)
Line 86 of that methods.js is "Meteor.users.update" in the code above. When trying to debug this using breakpoints it appears this is where the error is happening as well.
I am using this package to help with the user management UI that I am creating, although I have did some customizing to it. I have also tested this on a different version of my project for troubleshooting and I have found that it works when I don't use the Collection2 package.
Here is my custom schema setup:
Schema = {};
Schema.UserProfile = new SimpleSchema({
userProfile: {
type: Object
},
'userProfile.firstName': {
type: String,
optional: true,
label: "First Name"
},
'userProfile.lastName': {
type: String,
optional: true,
label: "Last Name"
},
'userProfile.birthday': {
type: Date,
optional: true,
label: "Date of Birth"
},
'userProfile.contactEmail': {
type: String,
optional: true,
label: "Email"
},
'userProfile.gender': {
type: String,
allowedValues: ['Male', 'Female'],
optional: true,
label: "Gender"
},
'userProfile.address': {
type: String,
optional: true,
label: "Address"
},
'userProfile.city': {
type: String,
optional: true,
label: "City"
},
'userProfile.stateProvince': {
type: String,
optional: true,
label: "State/Province"
},
'userProfile.postalCode': {
type: String,
optional: true,
label: "Postal Code"
},
'userProfile.phoneNumber': {
type: String,
optional: true,
label: "Phone Number"
},
userProfilePayment: {
type: Object
},
'userProfilePayment.paymentEmail': {
type: String,
optional: true,
label: "Payment Email"
},
'userProfilePayment.address': {
type: String,
optional: true,
label: "Address"
},
'userProfilePayment.city': {
type: String,
optional: true,
label: "City"
},
'userProfilePayment.stateProvince': {
type: String,
optional: true,
label: "State/Province"
},
'userProfilePayment.postalCode': {
type: String,
optional: true,
label: "Postal Code"
},
'userProfilePayment.phoneNumber': {
type: String,
optional: true,
label: "Phone Number"
},
});
Schema.User = new SimpleSchema({
username: {
type: String,
// For accounts-password, either emails or username is required, but not both. It is OK to make this
// optional here because the accounts-password package does its own validation.
// Third-party login packages may not require either. Adjust this schema as necessary for your usage.
optional: true
},
emails: {
type: Array,
// For accounts-password, either emails or username is required, but not both. It is OK to make this
// optional here because the accounts-password package does its own validation.
// Third-party login packages may not require either. Adjust this schema as necessary for your usage.
optional: true
},
"emails.$": {
type: Object
},
"emails.$.address": {
type: String,
regEx: SimpleSchema.RegEx.Email
},
"emails.$.verified": {
type: Boolean
},
createdAt: {
type: Date
},
profile: {
type: Schema.UserProfile,
optional: true
},
// Make sure this services field is in your schema if you're using any of the accounts packages
services: {
type: Object,
optional: true,
blackbox: 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
},
// In order to avoid an 'Exception in setInterval callback' from Meteor
heartbeat: {
type: Date,
optional: true
},
// Added to work with mizzao:user-status
status: {
type: Object,
optional: true,
blackbox: true
}
});
Meteor.users.attachSchema(Schema.User);
Meteor.users.allow({
// NOTE: The client should not be allowed to add users directly!
insert: function(userId, doc) {
// only allow posting if you are logged in
console.log("doc: " + doc + " userId: " + userId);
return !! userId;
},
update: function(userId, doc, fieldNames) {
// only allow updating if you are logged in
console.log("doc: " + doc + " userId: " + userId);
// NOTE: a user can only update his own user doc and only the 'userProfile' and 'userProfilePayment' field
return !! userId && userId === doc._id && _.isEmpty(_.difference(fieldNames, ['userProfile, userProfilePayment']));
},
/* NOTE: The client should not generally be able to remove users
remove: function(userID, doc) {
//only allow deleting if you are owner
return doc.submittedById === Meteor.userId();
}
*/
});
To remove a key in a mongodb update you want to use the $unset operator:
Meteor.users.update({ roles: role },{ $unset: { roles: 1 }}, { multi: true })
It's just a bit unusual that in your model a user can only have a single role.
This works and insert {name: 'ok', color: '#ff0000'} to the categories when using Robomongo
db.requirements.update({_id: 'kJBZp2gA8TgNX3z2j'}, {$addToSet: {categories: {name: 'ok', color: '#ff0000'}}})
It does not from Meteor.
It inserts an empty object {} into categories array
EDIT
After SimpleSchema.debug = true; I have this log:
SimpleSchema.clean: filtered out value that would have affected key
"categories.$._id", which is not allowed by the schema
same for name and color thus inserting an empty object {}
The schema is:
categories: {
type: [{
_id: {
type: String
},
name: {
type: String
},
color: {
type: String
}
}],
optional: true
}
What would be the correct schema then ?
I don't grasp all the differences, but here is the new schema that now works. Thanks Matt K for the debug option pointer.
'categories.$._id': {
type: String,
optional: true
},
'categories.$.name': {
type: String,
optional: true
},
'categories.$.color': {
type: String,
optional: true
},
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>