Adding fields from other Schemas to afQuickField - meteor

I want to use {{> afQuickfield name="profile" }} which will pull the name and city input fields and also have it display an input box for the username.
When I add {{> afQuickfield name="username"}} it will just sit lonely below outside the profile QuickField. I want it to be added to the panel along with the profile settings.
How can I achieve a clean Form which has both the Settings in the profile Schema and the username wrapped up in one Form.
Schemas.UserProfile = new SimpleSchema({
name: {
type: String,
optional: true
},
city: {
type: String,
optional: true
}
});
Schemas.User = new SimpleSchema({
username: {
type: String,
regEx: /^[a-z0-9A-Z_]{3,15}$/,
optional: true
},
(...)
profile: {
type: Schemas.UserProfile
}});
Meteor.users.attachSchema(Schemas.User);

I would use three separate afQuickfield for name, city, and username. They can all go in one autoform for User:
{{#autoForm collection="User" id="XXX" type="XXX"}}
{{> afQuickfield name="username"}}
{{> afQuickfield name="profile.name"}}
{{> afQuickfield name="profile.city"}}
{{/autoform}}

Related

Meteor change collection on user dropdown selection

I'm using Meteor in combination with autoForm / quickForm. I have on collection, lets call it "Sports" for this example. The collection asks the question which sports the user has done this week using a dropdown (allowedValues in autoForm). Now if the user selects running, I want to show 'distance', 'area', etc. If the user selects basketball, I might want to show 'shots taken', etc.
How should I go about this? Create multiple Collections or SimpleSchema's, or is there a different preferred approach? Could not find anything on Google, though I am sure this is not an uncommon question. If anyone has a link with more info that is already very much appreciated.
Update:
I am using an 'each' loop to loop through all possible sports I have defined earlier. Do you think it would make more sense to create a form item for each different sport? If so, how can I make sure this is correctly configured in the schema? Thank you in advance!
{{#autoForm collection="Sports" type="update" doc=this id="FieldValueIsForm"}}
{{#each sports}}
<h3>{{this.name}}</h3>
{{> afQuickField name="sports.$.sportTrue" noselect=true }}
{{#if afFieldValueIs name="sports.$.sportTrue" value=true}}
{{> afQuickField name="sports.$.sportDistance" value=this.frequency}}
{{/if}}
{{/each}}
<div>
<button type="submit">Submit</button>
</div>
{{/autoForm}}
Update 2:
My schema can be found here: http://pastebin.com/SbBSbqW2
I simplified it a bit, but this is the main content. For different sports I would need different input fields.
Sounds like you want to use the afQuickField option with a conditional. The documentation talks about it here. There is also a demo of what the code should look like here; however, it looks like this:
{{#autoForm collection="FieldValueIs" type="insert" id="FieldValueIsForm"}}
{{> afQuickField name="a" options="allowed" noselect=true}}
{{#if afFieldValueIs name="a" value="foo"}}
{{> afQuickField name="b"}}
{{/if}}
{{/autoForm}}
You would just need to make sure you set up "a" and "b" to be the select fields you want by setting them up properly in your schema.
UPDATE:
I assume you want to store the distance, shots taken, etc. in the SingleSport collection. Exactly how you store it is up to you, but it could look something like the following:
SingleSport = new SimpleSchema({
sportType: {
type: String
},
distanceRun: {
type: Number,
decimal: true,
optional: true
},
shotsTaken: {
type: Number,
optional: true
},
sportTrue: {
type: Boolean,
label: "Sport completed",
autoform:{
type: "boolean-radios",
trueLabel: "Enabled",
falseLabel: "Disabled",
value: false
}
}
});
Then, you could change the conditional section of your form like so:
{{#if afFieldValueIs name="sportType" value="running"}}
{{> afQuickField name="distanceRun"}}
{{/if}}
{{#if afFieldValueIs name="sportType" value="basketball"}}
{{> afQuickField name="shotsTaken"}}
{{/if}}

Autoform - Update Array of Objects

I have this Schema (collection: ReleaseForms) defined:
Diseases:{
type: [Object],
optional:true
},
"Diseases.$.name": {
type: String,
optional:true
},
"Diseases.$.description": {
type: String,
optional:true
},
"Diseases.$.language": {
type: String,
optional:true
},
and in example with following content added:
ReleaseForms.update({
"_id": idNewReleaseForm},
{
$push:{
Diseases:{
name:"Blutverdünnungstherapie",
description:"xxxxxxxxxxxx",
language: "de"
}
},
});
and if i view this via Autoform and say update, it doesn't show me the existing objects like (Blutverdünnungstherapie):
But "Name" shows the existing entry of Name!
{{#autoForm collection="ReleaseForms" id="afUpdateReleaseForm" type="update" doc=selectedReleaseFormDoc}}
<fieldset>
{{> afQuickField name="Name"}}
{{> afArrayField name="Diseases"}}
</fieldset>
<button type="submit" class="btn btn-primary">Update</button>
{{/autoForm}}
What can I do that I see the existing entries of Diseases and allows me to edit them?

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.

Autoform afArrayField invalid field name

I'm using Autoform in my Meteor app with the following schema:
Projects = new Mongo.Collection('Projects');
Projects.attachSchema(new SimpleSchema({
title: {
type: String,
label: "Project Title"
},
tiles: {
type: [Object],
label: "Tiles",
optional: true
},
"tiles.$": {
type: Array,
optional: true
},
"tiles.$.description": {
type: String,
label: "Tile Description",
optional: true
}
}));
In my template I have the following custom autoForm:
{{#autoForm collection="Projects" doc=this id="updateProjectInfo" type="update"}}
{{> afQuickField name="title"}}
{{> afArrayField name="tiles" template="AdminEditTile"}}
<button type="submit" class="btn btn-primary">SAVE</button>
{{/autoForm}}
And then the template for the afArrayField:
<template name="afArrayField_AdminEditTile">
{{> afFormGroup name="this.current.description"}}
</template>
However I'm receiving an error in the browser Exception in template helper: Error: Invalid field name: this.current.description
I've seen some people use the form this.atts.description before but this does not work either. Am I missing something here?
You have to remove the double quotes.
name=this.current.description

Meteor autoform access nested property

I've got some linked schemas and am trying to access properties of a subschema from the form for the primary schema. It's a mouthful, I know. Code may help:
//js
Collection = new Meteor.Collection('collection');
Schemas = {};
Schemas.secondary = new SimpleSchema({
unitType: {
type: String,
autoform: {
type: 'select',
options: //function with all the options
}
}
});
Schemas.primary= new SimpleSchema({
name: {
type: String,
},
units: {
type: [ Schemas.secondary ]
}
});
Collection.attachSchema(Schemas.primary);
//HTML
{{#autoForm collection="Collection" id="someId" type="insert"}}
{{> afQuickField name='name'}} // this works
{{> afQuickField name='units'}} // this works
{{> afQuickField name='units.unitType'}} // this doesn't work :-(
{{/autoForm}}
The reason I'm doing this is because there are other properties in the secondary schema that I want to show conditionally, based on the value of the select box. I also tried to put a form inside a form and then run {{#each afFieldNames name='"units"}} but that didn't quite work either. Instead of giving me just the fields contained in units (i.e., the secondary schema), it looped through all fields of both primary and secondary.
Thoughts? I'm not married to this pattern but I can't think of another way.
Thanks again, all.
db
I had this issue myself.
Give this a go
{{> afQuickField scope='units.unitType' name='units.unitType'}}
If you dump your modifier in your before submit hook you should be able to see the subdocument successfully filled out
AutoForm.hooks({
someId: {
before: {
'insert': function(modifier) {
console.log(modifier);
}
}
}
});
Let me know if this works for you!
All the best,
Elliott

Resources