Binds named fields of HTML form
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
test
.babelrc
.eslintrc.json
.gitignore
.npmignore
.travis.yml
LICENSE
README.md
package-lock.json
package.json
src.js
webpack.config.js

README.md

matreshka-parse-form npm version Coverage Status Build Status

The function binds named HTML form fields (input, select, textarea etc) contained at given HTML form to corresponding properties.

<form class="my-form">
    <input type="text" value="foo" name="x">
</form>
const object = {};
parseForm(object, '.my-form');

// ...
console.log(object.x); // 'foo'
object.x = 'bar'; // changes input value to 'bar'

Usage

In browser environment (or whatever environment where Matreshka is global variable) Matreshka is extended.

<script src="path/to/matreshka-parse-form.min.js"></script>
Matreshka.parseForm(object, form);

The bundle can be downloaded at gh-pages branch


In CJS environment Matreshka is not extended.

npm install --save matreshka-parse-form
const parseForm = require('matreshka-parse-form');

API

The function accepts 4 arguments:

  • object - an object (required)
  • form - a selector, DOM node etc. of given form (custom selectors :sandbox and :bound(XXX) also acceptable) (required)
  • callback - a function which will be called on every found field; accepts field name and field element itself
  • eventOptions - event options which will be passed to every internal call of bindNode.

Returns: parsed form element.

The third argument is usable when parseForm is used with Matreshka.Object: you can call addDataKeys method there.

const form = parseForm(this, ':sandbox .foo', key => this.addDataKeys(key), {
    getValueOnBind: false
});