Epic update to form components package

announce
1

1.13.0

Now supports returning custom success/failed messages from the form action, makes building complex parent/child form element structures easier, allows for async validation, and provides supremely easy form resets.

Changelog

2

Are there any known problems with the current Windows preview of meteor? Or am I missing something blatantly obvious?

Chrome is just displaying a blank page and the console is showing the following error message:

Uncaught TypeError: Cannot convert undefined or null to object

This is my test code (basically taken from the documentation):

myFormTemplate.html:

<template name="myFormTemplate">
  <p>The form.</p>
  {{> basicInput schema=schema field='testField'}}
</template>

myFormTemplate.js

ReactiveForms.createElement({
  template: 'basicInput',
  validationEvent: 'keyup'
});


Template.myFormTemplate.helpers({
  schema: function () {
    return new SimpleSchema({
      testField: {
        type: String,
        max: 3,
        instructions: "Enter a value!"
      }
    });
  },
  action: function () {
    return function (els, callbacks, changed) {
      console.log("[forms] Action running!");
      console.log("[forms] Form data!", this);
      console.log("[forms] HTML elements with `.reactive-element` class!", els);
      console.log("[forms] Callbacks!", callbacks);
      console.log("[forms] Changed fields!", changed);
      callbacks.success(); // Display success message.
      callbacks.reset();   // Run each Element's custom `reset` function to clear the form.
    };
  }
});

And for the sake of completeness templatesformstest.html:

<head>
  <title>templatesformstest</title>
</head>

<body>
  <h1>First test of templates:forms.</h1>

  {{> myFormTemplate}}
</body>
3

Thanks for this. Would you mind posting this in an issue on the project’s GitHub page?

I have confirmed this bug–it is not Windows-specific. It only affects Elements that are running standalone in the latest version of the package (it relates to the new support for multiple levels of sub-Elements).

I believe you aren’t actually trying to run an Element this way, though, so you should try wrapping the Element in a Form Block.

Technically an Element should work by itself, just for individual validation. But the action function you’re testing only runs if the Element is inside a Form Block.

4

Thanks for the explanation, I have created an issue on GitHub.

You are of course right, the posted standalone use of the Form Element does not reflect the final application. I was rather doing some first evaluations of the package and came across this issue.

Based on what I read in the documentation, I really do like your approach towards handling forms in Meteor. It seems like a very good balance between having a lightweight package, providing good developer productivity and giving sufficient control over the details of the form handling.

5

Thank you!

Published an update earlier today that fixes several bugs including this one. Everything seems to be working great now.