0

Currently using meteor flow-db-admin as admin template https://github.com/sachinbhutani/flow-db-admin

But the autoform doesn't seem to work with the simpl-schema as the labels don't show and the validation doesn't work

package.json

{
  "name": "tours",
  "private": true,
  "scripts": {
    "start": "meteor run",
    "test": "meteor test --once --driver-package meteortesting:mocha",
    "test-app": "TEST_WATCH=1 meteor test --full-app --driver-package meteortesting:mocha",
    "visualize": "meteor --production --extra-packages bundle-visualizer"
  },
  "dependencies": {
    "@babel/runtime": "^7.1.5",
    "bcrypt": "^3.0.0",
    "classnames": "^2.2.6",
    "meteor-node-stubs": "^0.4.1",
    "react": "^16.4.2",
    "react-addons-pure-render-mixin": "^15.6.2",
    "react-dom": "^16.4.2",
    "react-mounter": "^1.2.0",
    "simpl-schema": "^1.5.3"
  },
  "meteor": {
    "mainModule": {
      "client": "client/main.js",
      "server": "server/main.js"
    },
    "testModule": "tests/main.js"
  },
  "devDependencies": {
    "chai": "^4.1.2"
  }
}

.meteor/packages

# Meteor packages used by this project, one per line.
# Check this file (and the other files in this directory) into your repository.
#
# 'meteor add' and 'meteor remove' will edit this file for you,
# but you can also edit it by hand.

meteor-base@1.4.0             # Packages every Meteor app needs to have
mobile-experience@1.0.5       # Packages for a great mobile UX
mongo@1.6.0                   # The database Meteor supports right now
reactive-var@1.0.11            # Reactive variable for tracker
tracker@1.2.0                 # Meteor's client-side reactive programming library

standard-minifier-css@1.5.0   # CSS minifier run for production mode
standard-minifier-js@2.4.0    # JS minifier run for production mode
es5-shim@4.8.0                # ECMAScript 5 compatibility for older browsers
ecmascript@0.12.0              # Enable ECMAScript2015+ syntax in app code
shell-server@0.4.0            # Server-side component of the `meteor shell` command

react-meteor-data
accounts-ui@1.3.1
accounts-password@1.5.1
meteortesting:mocha
twbs:bootstrap
static-html
jquery
kadira:flow-router
kadira:blaze-layout
dburles:collection-helpers
accounts-base@1.4.3
alanning:roles
fortawesome:fontawesome
meteortoys:allthings
check@1.3.1
aldeed:collection2-core
sach:flow-db-admin
aldeed:simple-schema

server/main.js

import { Meteor } from 'meteor/meteor';

// import '../imports/startup/accounts-config.js';
import '../imports/routes.js';
import '../imports/schemas.js';
// import '../imports/startup/admin-config.js';

Meteor.startup(() => {
/*
*/
  AdminConfig = {
  collections: {
    Posts: {}
  }
};

});

client/main.js

import React from 'react';
import { Meteor } from 'meteor/meteor';
import { render } from 'react-dom';

import '../imports/startup/accounts-config.js';
import '../imports/routes.js';
import '../imports/schemas.js';
// import '../imports/startup/admin-config.js';

Meteor.startup(() => {

/*
*/
  AdminConfig = {
  collections: {
    Posts: {}
  }
};
});

imports/schemas.js

import React from 'react';
// import { FlowRouter } from 'meteor/kadira:flow-router'
import { mount } from 'react-mounter';
import SimpleSchema from 'simpl-schema';
SimpleSchema.extendOptions(['autoform']);



Schemas = {};

Posts = new Meteor.Collection('posts');
Users =   Meteor.users;

Schemas.Posts = new SimpleSchema({
  title: {
    label: 'Title',
    type: String,
    max: 60
  },
  content: {
    label: 'Content',
    type: String,
    autoform: {
      rows: 5
    }
  },
  createdAt: {
    type: Date,
    label: 'Date',
    autoValue: function () {
      if (this.isInsert) {
        return new Date();
      }
    }
  },
  owner: {
    label: 'Author',
    type: String,
    regEx: SimpleSchema.RegEx.Id,
    autoValue: function () {
      if (this.isInsert) {
        return Meteor.userId();
      }
    },
    autoform: {
      options: function () {
        return _.map(Meteor.users.find().fetch(), function (user) {
          return {
            label: user.emails[0].address,
            value: user._id
          };
        });
      }
    }
  }
});

Posts.attachSchema(Schemas.Posts);

Then after launching, it shows the below; the validation doesn't work and the labels are not displayed also.

Please help

enter image description here

Orion
  • 125
  • 11
  • Please add your `package.json` and `.meteor/packages` lists in order to check if there is a compatibility issue. – Jankapunkt Nov 21 '18 at 17:40
  • @Jankapunkt updated – Orion Nov 21 '18 at 21:33
  • You should remove aldeed:simpl-schema from the meteor packages list because it is deprecated. The correct package is already installed in your npm depencies. By the way - are you using blaze and react together or why are there the kadira packages? – Jankapunkt Nov 21 '18 at 21:38
  • There's no aldeed:simpl-schema there, you mean the aldeed:simple-schema?. No I'm not, would remove that – Orion Nov 21 '18 at 21:52
  • Yes remove aldeed:simple-schema and remove everything that is blaze related if you only want to use react. Then please try again if the form is now rendering correctly. – Jankapunkt Nov 21 '18 at 21:58
  • I've removed them, still not rendering – Orion Nov 22 '18 at 04:57

0 Answers0