{{#autoForm schema="asdf" id="sdfg" type="method" meteormethod="meth"}}
<fieldset>
{{> afQuickField name="startLocation"}}
{{> afQuickField name="destination"}}
{{> afQuickField name="date"}}
{{> afQuickField name="departureTime"}}
{{> afQuickField name="returnTime"}}
{{> afQuickField name="seats" type="number"}}
</fieldset>
<button type="submit" class="btn btn-primary">submit<button>
{{/autoForm}}
The above code generates a form in my Meteor app, however it looks pretty bad (or at least, non-intuitive):
I don't know why this is. In the examples (1, 2) I'm looking at, the form renders in a much more sensical way. How can I get the afQuickField to show the label and the input on separate lines, or at least in another way that makes sense?
Related
I'm using the useraccounts package in my Meteor app. I want an admin to be able to add a new user (and disable signing up through the frontend). Therefore, I have added a Collection with a SimpleSchema as per the suggestion of meteor-collection2. I'm alos using AutoForm to create an 'Add user' page.
<template name="addCustomerProfile">
<div class="container">
<h1>Edit document</h1>
{{#if isReady 'updateCustomerProfile'}}
{{#autoForm collection="Users" id="userForm" type="insert" }}
<fieldset>
{{> afQuickField name='emails.0.address'}}
{{> afQuickField name='emails.0.verified'}}
{{> afQuickField name='services.password'}}
{{> afQuickField name='username'}}
{{> afQuickField name='profile.firstName'}}
</fieldset>
<button type="submit" class="btn btn-primary">Add User</button>
{{/autoForm}}
{{else}}
Nothing
{{/if}}
</div>
</template>
I can add users whenever the 'services.password' is not added to the form, but obviously no default password is set for the user in the Mongo database in that case. How can I add a field so the admin can set a default password for that user (which the user will then be able to change later on).
Why not just forbidClientAccountCreation and sendEnrollmentEmail?
Accounts.config({
forbidClientAccountCreation: true
});
Meteor.methods({
'inviteUser': function (doc) {
check(doc, YourForm);
let userId = Accounts.createUser(doc);
Accounts.sendEnrollmentEmail(userId);
}
});
I am trying to get two afQuickField text fields to display in the same line and from any example I have seen, which is not very many out there, I can not get them to look correct. I have a client form, it has address etc in it. I am trying to get the Suite fiel and the City field to display inline on the same line. I am also trying to get the State and Zip fields on the same line.
I can accomplish this if I have my bootstrap grid set to col-md-6 so that this form is in half the page. The will be inline however they will not be the full width of the col as all the other text fields are and it looks funny. But what I really want is for this form to be in a col-md-4. When I do this it seperates both of these and puts them on seperate lines but again neither are the full length like other text fields. I have attached pictures here of both senarios.
What I am looking for is to have these two fields lineup to be the same width as the other fields around them so they don't stand out like a sore thumb.
I have attached a plnkr of my html doc as well as pasted the applicable code below.
{{#autoForm collection="customers" id="insertCustomer" type="insert"}}
<div class="row customerForm">
<div class="col-md-4 rcorners">
<!-- ************************************************
***** Customer Name and address fields ***********
************************************************ -->
{{> afQuickField name='customerName' template="bootstrap3-horizontal"
input-col-class="col-sm-12 padL-0" label-class="sr-only"
afFieldInput-placeholder="schemaLabel"}}
{{> afQuickField name='customerAddress' template="bootstrap3-horizontal"
input-col-class="col-sm-12 padL-0" label-class="sr-only"
afFieldInput-placeholder="schemaLabel"}}
<div class="form-inline">
{{> afQuickField name='customerSuite'
template="bootstrap3-inline" label-class="sr-only"
afFieldInput-placeholder="schemaLabel"}}
{{> afQuickField name='customerCity'
template="bootstrap3-inline" label-class="sr-only"
afFieldInput-placeholder="schemaLabel"}}
</div>
<div class="form-inline">
{{> afQuickField name='customerState'
template="bootstrap3-inline" label-class="sr-only"
afFieldInput-placeholder="schemaLabel"}}
{{> afQuickField name='customerZip'
template="bootstrap3-inline" label-class="sr-only"
afFieldInput-placeholder="schemaLabel"}}
</div>
{{> afQuickField name='customerPhone1' template="bootstrap3-horizontal"
input-col-class="col-sm-12 padL-0" label-class="sr-only"
afFieldInput-placeholder="schemaLabel"}}
http://plnkr.co/edit/y0v2Xltdfs01wqZS5ZIg
I have created an AutoForm update form that I am populating with the contents of a document. I am having a difficult time getting AutoForm to display the email address stored in the document.
<template name="edit_user_form">
{{#autoForm schema=schema id="edit_user_form" type="update" collection=Meteor.users doc=selected_user_doc}}
<fieldset>
{{> afQuickField name="profile.first_name"}}
{{> afQuickField name="profile.last_name"}}
{{> afQuickField name="emails"}}
{{> afQuickField name="status" options="allowed" noselect=true}}
{{> afQuickField name="roles" options="allowed" noselect=true}}
<div>
<button type="submit" class="btn btn-primary">Submit</button>
<button type="reset" class="btn btn-default">Reset</button>
</div>
</fieldset>
{{/autoForm}}
</template>
As a result, the Emails input field is populated with "[object Object]".
Since I am only allowing one e-mail per user, what is the correct way to tell AutoForm to populate a form field with an e-mail address? Thanks.
Yes, in meteor accounts, emails are considered an array. You can use this notation from the autoform github's issues:
{{> afQuickField name="emails.0.address"}}
I am using meteoric-autoform and doing an update to my values, The form is not getting populated with existing values and also the update is not happening.
I could also see that the template helper method that I have for fetching the id is not getting invoked at all.
assesmentEdit.js
Template.assesmentEdit.helpers({
assesment: function () {
alert("entered helper");
console.log(template.data.id);
var template = Template.instance();
return Assesments.findOne({_id: template.data.id});
}
});
assesmentEdit.html
<template name="assesmentEdit">
{{#ionModal customTemplate=true}}
{{# autoForm collection="Assesments" id="assesments-edit-form" type="update"}}
<div class="bar bar-header bar-stable">
<button data-dismiss="modal" type="button" class="button button-clear">Cancel</button>
<h2 class="title">Edit Assesment</h2>
<button type="submit" class="button button-positive button-clear">Save</button>
</div>
<div class="content has-header overflow-scroll">
{{> afQuickField name="name" }}
{{> afQuickField name="email"}}
{{> afQuickField name="category"}}
{{> afQuickField name="location"}}
</div>
{{/autoForm}}
{{/ionModal}}
</template>
As you can see in the docs, update forms require a doc attribute.
{{# autoForm doc=assesment collection="Assesments" id="assesments-edit-form" type="update"}}
I'm using a package called AutoForm.
{{> afQuickField name="propertyInfo.zipcode" placeholder="XXXXX" class="form-control track-order-change"}}
It basically renders a label and input element.
I have a session variable:
Session.set("zipcode", //something dynamic);
I have a registered helper:
Handlebars.registerHelper("zipcode", function(){
return Session.get("zipcode");
})
I would like something like this to work:
{{> afQuickField name="propertyInfo.zipcode" value="{{zipcode}}" placeholder="XXXXX" class="form-control track-order-change"}}
First fix you global helper to read:
Template.registerHelper("zipcodeHelper", function(){
return Session.get("zipcode");
})
Then fix the afQuickField a little:
{{> afQuickField value=zipcodeHelper class="form-control track-order-change"}}
Refer to this GH issue: https://github.com/aldeed/meteor-autoform/issues/210