react-form-utils

2.0.0 • Public • Published

react-form-utils

Build Status

react-form-utils provides helper functions to retrieve form props and form values

import {inputPropsLookup, inputValueLookup, formSerialize} from 'react-form-utils';

inputPropsLookup(fieldsProps, fieldName)

Argument Type Example
fieldsProps object {name: {type: 'text'}, email: {type: 'email'}}
fieldName string name, email[0], email[1]

returns

object: props, e.g. {type: 'text'}

e.g.

const fieldsProps = {
  name: { type: 'text' },
  age_group: {
    type: 'select',
    size: 4,
    options: []
  }
  address: {
    type: 'nested',
    fields: {
      street: {
        type: 'text'
      }
    }
  }  
};
const fieldName = 'address[0][street]';
 
const props = inputPropsLookup(fieldsProps, fieldName);
// <input name={fieldName} {...props} />

formSerialize(form)

formSerialize(form)  
Argument Type Example
form DOMNode form element

returns

object. serialized, e.g. {type: 'text'}

e.g.

// <form><input name="message" value="hello"/></form>
 
const values = formSerialize(this.form);
// { message: 'hello' }
 

inputValueLookup(values, fieldName)

Argument Type Example
values object {address: [ {zip: '55555'} ]}
fieldName string address[0][zip]

returns

any. input value, e.g. {type: 'text'}

e.g.

const values = {
  name: 'Ali',
  age_group: '31-40'
  address: {
    0: {
      street: '13 Calle 49a'
     }
};
const fieldName = 'address[0][street]';
 
const value = inputValueLookup(values, fieldName);
 
// <input name={fieldName} value={value} />

Package Sidebar

Install

npm i react-form-utils

Weekly Downloads

0

Version

2.0.0

License

MIT

Unpacked Size

6.16 kB

Total Files

4

Last publish

Collaborators

  • alvinsj