1.0.7 • Published 10 years ago

mdl-form v1.0.7

Weekly downloads
1
License
MIT
Repository
github
Last release
10 years ago

Form for Material Design Lite

Start

  • Node.js must be installed.
  • Install package:
  npm install mdl-form jquery react 

Example

You can see here.

List

Render

  • Give a json to data. The parameter is at here.
  • Give an object of components to tags.
    • key is also used in tags of form.
    • value is component.
    • If you do not set a default component, form will set first component to default component.

Animation

  • You can add an animation at render.
  • form-hide-animation will hide form and rerender new form. form-hide will be added finally.
  • form-show-animation will show form after form is updated. form-show will be added finally.
  • noAnimation -> if you use noAnimation={true}, this form will not render with animation.

Parameter

Title

  • label
  • className
  • style

Submit

  • label
  • className
  • style
  • url
  • click(function)
  • success(function)
    • 1st argument -> get data from server.
  • fail(function)
    • 1st argument -> data which you post to server.

Form

  • This is an object for your componets in Form.
  • id is needed.
  • isNotRequire -> if you use isNotRequire: true, this component can be empty to post to server.

How to write component

  • You can see list.
  • Props have three function and one data
    • keyDown(function) -> this will call a click on submit.
    • getData(function) -> give data to form.
      • 1st argument -> id of this component, use this.props.data.id, normal.
      • 2nd argument -> give this component data to form.
      • You should call it in render function and set data to empty.
      • Example: this.props.getData(this.props.data.id, '')
    • getComponents(function) -> give this component to form.
      • 1st argument -> idof this component, usethis.props.data.id`, normal.
      • 2nd argument -> this component.
      • You should call it in render function.
      • Example: this.props.getComponent(this.props.data.id, this).
    • data -> all information about component is in this.props.data.
1.0.7

10 years ago

1.0.6

10 years ago

1.0.5

10 years ago

1.0.4

10 years ago

1.0.3

10 years ago

1.0.2

10 years ago

1.0.1

10 years ago

1.0.0

10 years ago