meteor-autoform-documents

View documents, create new documents or update documents within your autoform.

Installation

Install via

meteor add jkuester:autoform-documents

Usage

The following example uses a SimpleSchema based schema that can be passed for example to a quickForm. Consider the following collection:

1{
2  doc: {
3    // we will only store the id of the doc
4    // to keep the database clean and tidy
5    type: String,
6    
7    // you could justr display the name of the other collection
8    label: 'Doc from another collection',
9    
10    autoform: {
11      // required to load the template
12      type: 'documents',
13      
14      // Methods are required to handle
15      // the findOne, insert, update, remove
16      // of the external collection without
17      // coupling the collection to the template.
18      // All methods work with the three examples below
19      methods: {
20        
21        // example 1: get from synced client
22        // note, there is a callback in case the doc is not
23        // synced via subscription but retrieved e.g. by method
24        get (docId, callback) {
25          callback(null, SomeCollection.findOne(docId))
26        },
27        
28        // example 2: externally call the method
29        insert (insertDoc, callback) {
30          Meteor.call('insertSomeDoc', insertDoc, callback)
31        },
32        
33        // example 3: pass only the method name
34        // and the method will be called from the template.
35        // note, that the arguments which are passed to the
36        // method are designed in accordance to the 
37        // AutoForm.getFormValues insertDoc / updateDoc
38        update: 'someUpdateMethodName',
39      },
40      
41      // a schema of the other collection is required to
42      // render to form for the external docs correctly
43      schema: SomeCollection.schema,
44      
45      // provide a first option like for any other
46      // select based component in AutoForm
47      firstOption: () => i18n.get('form.selectOne'),
48      
49      // provide the list of selectable docs,
50      // this example assumes, that there are fields
51      // like title or description but you can choose any
52      // values you like.
53      options() {
54        return SomeCollection
55          .find()
56          .fetch()
57          .map(doc => ({
58            value: doc._id,
59            label: doc.title,
60            description: doc.description
61          }))
62      },
63      
64      // you can configure appearance
65      // and labeling of the submit button
66      buttons: {
67        insert: {
68          classes: 'btn btn-success',
69          label: () => i18n.get('actions.insert')
70        },
71        update: {
72          classes: 'btn btn-primary',
73          label: () => i18n.get('actions.update')
74        }
75      }
76    }
77  }
78}

Bootstrap Bug

Note, that there is a bootstrap bug for Modals that are placed within a list-group-item. The bug applies for this template, if it is used within an array (Autoform displays it using a list-group). To prevent the bug, you need to add the following line to your application's CSS:

1.list-group-item, .list-group-item:hover{ z-index: auto; }

Changelog

1.4.1

delete also existing schemas by instanceId in onDestroyed
fix existing value not set to hidden input bug using onRendered

1.4.0

invalid state handling added
fixed schema and modal bugs when multiple instances of the template are used in a form
submit button styling via schema added
included formIsValid check for every submit
fix borders for lists
removed unused css
added formIsValid helper to check form and add sticky validation errors
methods args for template can now be meteor method names or external functions
html layout bootstrap 4 compatible modal
removed unused test file
extracted autoform extension def into own file

1.3.0

Set existing value (e.g. in updte form) before autorun so deselecting value is supported
Optionally map a "description" field

Lince

MIT, See License File