Form doesn't get individual form ID - meteor

I have an {{each}} statement which is suppose to have a form in. I can't figure out why the form doesn't use the forms unique _id. Any suggestions?
Path: helper.js
Template.Offer.helpers({
jobOffers: function () {
return JobOffers.find({candidateUserId: Meteor.userId()});
},
makeUniqueID: function () {
return this._id;
}
});
Path: template.html
{{#each jobOffers}}
{{#autoForm collection="JobOffers" id="makeUniqueID" doc=this type="update"}}
{{> afQuickField name='offer'}}
<button type="submit" class="btn btn-primary submit">Update</button>
{{/autoForm}}
{{/each}}

With
id="makeUniqueId"
you make the form have id equal to exactly the string "makeUniqueId". To generate new IDs, omit quotes:
id=makeUniqueId
This will tell Spacebars to evaluate the function that stays behind the makeUniqueId helper, therefore supplying the autoForm template with proper value for id parameter.

Related

Meteor Error: Missing required parameters on path The missing params are: ["_id"]. The params object passed in was: {}

I have this in my routes:
Router.map(function() {
...
this.route('studentEdit', {
path: '/student/:_id/edit',
data: function() {
return Students.findOne(this.params._id);
},
});
this.route('studentDetail', {
path: '/student/:_id',
data: function() {
return Students.findOne(this.params._id);
}
});
...
});
And I have this in my template using autoform:
{{#autoForm collection="Students" id="studentEdit" doc=this type="update"}}
{{> afQuickField name='name'}}
{{> afQuickField name='phone'}}
{{> afQuickField name='address' rows=6}}
{{> afQuickField name='remarks' rows=6}}
<button type="submit" class="btn waves-effect waves-light"><i class="material-icons">save</i></button>
{{/autoForm}}
The edit page loads fine, with the prepopulated fields. And when I save, it does save, yet, it doesn't redirect to the detail page, and returns this error in console:
Exception in delivering result of invoking '/students/update': Error: Missing required parameters on path "/student/:_id". The missing params are: ["_id"]. The params object passed in was: {}.
UPDATE
Routing to the detail page now works, yet the error still exist in the console. I must be missing something. This is what I've done to get it working for the time being:
var moveOnRouter = {
onSuccess: function(formType, result) {
Router.go('studentDetail', {_id: this.docId});
}
}
AutoForm.addHooks('studentEdit', moveOnRouter);
You need to explicitly go to the other route on submit from your form. But since your button is a submit you also need to prevent the default submit action.
With template events you'd do something like:
Template.myTemplate.events({
'submit .btn'(ev) {
ev.preventDefault();
router.go('studentDetail',{ _id: this.docId });
}
});
But since you're hooking autoform perhaps it's easier just to remove the type="submit" from your button definition.

Meteor: Spacebars each parameter

I'm new to Meteor.js and have run into a problem.
I am passing in a user object to a profile template e.g.:
{
_id: "D8JpXRQskm3grykjg",
username: "foo",
profile: {communities: ["AkGCakz6mSgMb8qyS", "j8aB3i5iscrC4ehkA"]},
}
<template name="profile">
<h1> {{username}}: {{_id}} </h1>
<h3>Communities</h3>
<hr>
{{#each profile.communities}}
{{> communityItem}}
{{/each}}
</template>
The problem is I've already written a communityItem template that I am using elsewhere which accepts the communityName. Is there a way that I can write a helper function, passing in the communityIds list that would return a list of community names? I would like:
...
{{#each getCommunityNames(profile.communities)}}
{{> communityItem}}
{{/each}}
...
I could very well be approaching the problem the wrong way or not writing in a "Spacebars" fashion. Thanks!
sure you can:
Template.myTemplate.helpers({
getCommunityNames: function(commIds) {
var communities = Communities.find({_id: {$in: commIds}}).fetch();
return _.pluck(communities, 'name'); // returns ['Name 1', 'Name 2'];
}
});
Note, the syntax method param not method(param)
{{#each getCommunityNames profile.communities}}
{{>communityItem}}
{{/each}}

Meteor Autoform update a nested collection

I'm trying to create a form in order to insert a new element inside a nested array in a collection.
Here are my schemas :
Schemas.CampaignsSchema = new SimpleSchema({
'name': {
type: String
}
});
​
Schemas.ElectionsSchema = new SimpleSchema({
'campaigns': {
type: [Schemas.CampaignsSchema],
defaultValue: []
}
});
Here is my template :
Template.campaignsNew.helpers({
schema() { return Schemas.CampaignsSchema; },
});
​
​
<template name="campaignsNew">
{{#autoForm
collection='Elections'
schema=schema
doc=doc
scope='campaigns'
id='insertCampaignForm'
type='update-pushArray'}}
<fieldset>
<legend>Add a Campaign</legend>
{{> afQuickField name='campaigns.$.name'}}
</fieldset>
<button type="submit" class="btn btn-primary">Insert</button>
{{/autoForm}}
</template>
So a field is generated by autoform but nothing happens when I hit submit.
If I enable Autoform.debug() I got :
SimpleSchema.clean: filtered out value that would have affected key "campaigns", which is not allowed by the schema
SimpleSchema.clean: filtered out value that would have affected key "campaigns.$", which is not allowed by the schema
SimpleSchema.clean: filtered out value that would have affected key "campaigns.$.name", which is not allowed by the schema
Does someone have any idea?
It seems that the schema attribute of #autoform doesn't work with the type update-pushArray.
Here is the template that works with the reste of the code :
<template name="campaignsNew">
{{#autoForm
collection='Elections'
doc=election
id='insertCampaignForm'
type='update-pushArray'
scope='campaigns'}}
<fieldset>
<legend>Add a Campaign</legend>
{{> afQuickField name='name'}}
</fieldset>
<button type="submit" class="btn btn-primary">Insert</button>
{{/autoForm}}
</template>
The only issue is that the name field is pre-filled with the Election name...
It seems that your nested document mustn't have a field with the same name as the main document.
Yet the created nested document has the good name and the main document's name remain unchanged.

'this' context in Meteor event is empty object

Template works fine (in terms of data being displayed), but event doesn't. Particularly odd because I have a different template with almost the identical code in which it works.
<template name="profile_sidebar">
{{#if opened}}
{{> profile_sidebar_contents}}
{{/if}}
</template>
<template name="profile_sidebar_contents">
{{#if dataReady}}
{{#unless equalsCurrentUsername profile.login}}
<span>
<a class="message-user"><i class="ion-chatbox"></i> Message</a>
</span>
{{/unless}}
{{/if}}
</template>
Template.profile_sidebar_contents.events({
'click .message-user': function(e,t){
// this is {}
// t.data is null
Session.set('selectedConversation', this._id);
Router.go('/messages');
}
});
Thank you!
Found a solution!
I wrapped the entire template in a {{#with profile}} ... {{/with}} block and then added the data I needed to be within the profile object returned in the helper. It seems as though the context of the event was empty object because the event target was not within a scope.
Elaborated below
I assumed that the context would default to an object which had as fields all helpers. Ex. I had
Template.profile_sidebar_contents.helpers({
profile: function(){ return something },
id: function() {return somethingelse }
});
and I expected the context of this to be {profile: something, id: somethingelse}
but it seems that this isn't done and the context is empty. I moved it to be
Template.profile_sidebar_contents.helpers({
profile: function(){ return {profile:something, id:somethingelse} }
});
and then set {{#with profile}} ... {{/with}} and had access to the profile helper returned object, by which I could retrieve id by this.id and profile by this.profile

How to pass a default value for a field in 'insert' form?

How to pass a default value for a field in 'insert' form?
I'm using Meteor's packages: Autoform, Collections2, and Simple-Schema.
My process is:
A User selects some value in a list on a page, then
The 'insert' from opens, and I want that one field to be initialized with the value the user chose on a previous step.
Can't figure out how to pass a parameter withing URL (or any other way).
The problem is how to initialize form with the value.
Suppose I have an URL:
http://localhost:3000/activity/new/Sport
===============
router.js:
...
Router.map(function () {
...
this.route('newActivity', {
path: '/activity/new/:tag',
data: function() {
Session.set('tag', this.params.tag);
return null;
}
});
...
===============
models/activity.js
...
Activities = new Meteor.Collection("activities", {
schema: {
title: {
type: String,
label: 'название'
},
...
tag: {
type: String,
label: 'тэг'
}
}
});
================
templates/avtibity.js
...
Template.newActivity.helpers({
defaultTag: function() {
return Session.get('tag');
}
});
...
================
templates/activity.html
...
<template name="newActivity">
<h1>Create new Activity!</h1>
{{#autoForm collection="Activities" id="insertActivityForm" type="insert"}}
{{> afQuickField name="title"}}
...
{{> afQuickField name="tag" value=" ?????? "}} // ? {{defaultTag}}
ho ho ho {{defaultTag}}
{{/autoForm}}
</template>
```
Thanks to Eric Dobbertin:
You could set value equal to a helper that returns the desired value ({{> afQuickField name="tag" value=valueHelper}})
List item You could set doc to an object that has the value set to what you want. Just like you would for an update form.
https://github.com/aldeed/meteor-autoform/issues/210

Resources