Skip to content

altjs/form

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Jan 30, 2016
f9bda5e · Jan 30, 2016

History

26 Commits
Jan 23, 2016
Oct 15, 2015
Oct 15, 2015
Oct 29, 2015
Jan 30, 2016
Jan 30, 2016

Repository files navigation

alt-form

Manages your forms with alt. Uses flux-form for all the heavy lifting.

const form = altForm('Company', alt, {
  fields: [ 'name' ],
})

class EditName extends React.Component {
  constructor(props) {
    super(props)

    this.state = form.getProps({
      name: props.initialName
    })
  }
  
  // Please don't connect stores yourself, use something like
  // https://github.com/altjs/react which connects your stores automatically
  componentDidMount() {
    this.unlisten = form.store.listen(state => this.setState(state))
  }
  
  componentWillUnmount() {
    this.unlisten()
  }

  render() {
    return (
      <div>
        <label className="quarter" htmlFor="Company Name">Company Name</label>
        <input
          type="input"
          placeholder="Name"
          {...this.state.props.name}
        />

        <input type="button" onClick={this.state.save} />
      </div>
    )
  }
}

export default EditName
<EditName initialName="Jane" />

This allows you to edit a name. altForm will return you an Alt store which keeps track of all the edits made and handles listening to the actions for you.