Search code examples
meteormeteor-autoformsimple-schemameteor-collection2

Meteor 1.4. AutoForm validation message not showing


  1. I've added autoform packege (meteor add aldeed:autoform)
  2. I've added collection2-core packege (meteor add collection2-core)
  3. I've installed simpl-schema (npm i --save simpl-schema) But form still does not working correctly

/imports/api/rooms/rooms.js

import { Tracker } from 'meteor/tracker';
import { Mongo } from 'meteor/mongo';
import SimpleSchema from 'simpl-schema';
SimpleSchema.extendOptions(['autoform']);

export const Rooms = new Mongo.Collection('rooms');

Rooms.attachSchema(new SimpleSchema({
    title: {
        type: String,
        label: 'Title'
    },
    desc: {
        type: String,
        label: 'Description'
    },
    createdAt: {
        type: Date,
        autoValue(){
            return new Date();
        }
    },
}), {tracker: Tracker});

/imports/ui/pages/home.js

import { Template } from 'meteor/templating';

import './home.html';

import { Rooms } from '../../api/rooms/rooms.js'

Template.Home.helpers({
    rooms() {
        return Rooms.find({});
    },
    CollectionRooms() {
        return Rooms;
    }
});

/imports/ui/pages/home.html

<template name="Home">
    <div class="jumbotron">
        <div class="container text-center">
            <h1>Forum</h1>
            <p>“Don't raise your voice, improve your argument."</p>
        </div>
    </div>

    <div class="container-fluid bg-3">
        <h3 class="page-header">Choose your room</h3>

        {{> quickForm collection=CollectionRooms id="insertRoomsForm" type="insert"}}

        <div class="row grid-divider">
        {{#each rooms}}
            <div class="col-sm-4">
                <div class="col-padding">
                    <h3>{{title}}</h3>
                    <p>{{desc}}</p>
                </div>
            </div>
        {{/each}}
        </div>
    </div>
</template>

packages

[email protected]             # Packages every Meteor app needs to have
[email protected]       # Packages for a great mobile UX
[email protected]                   # The database Meteor supports right now
[email protected] # Compile .html files into Meteor Blaze views
[email protected]            # Reactive variable for tracker
[email protected]                 # Meteor's client-side reactive programming library

[email protected]   # CSS minifier run for production mode
[email protected]    # JS minifier run for production mode
[email protected]                # ECMAScript 5 compatibility for older browsers.
[email protected]              # Enable ECMAScript2015+ syntax in app code
[email protected]            # Server-side component of the `meteor shell` command

[email protected]             # Publish all data to the clients (for prototyping)
[email protected]                # Allow all DB writes from clients (for prototyping)
twbs:bootstrap
iron:router
aldeed:autoform
aldeed:collection2-core

I see the form and it inserts record into database, but validation message not showing and why there is field "created at"? what I'm doing wrong? enter image description here


Solution

  • There is a typo in your Schema, which causes the Tracker not been included. This in the end causes your form to not have (reactive) validation messages. The corrected code is:

    Rooms.attachSchema(new SimpleSchema({
        title: {
            type: String,
            label: 'Title'
        },
        desc: {
            type: String,
            label: 'Description'
        },
        createdAt: {
            type: Date,
            autoValue(){
                return new Date();
            }
        },
    }, {tracker: Tracker}));