santosh-btc

import React from 'react';
import { Field, reduxForm } from 'redux-form';


function validate(values) {
  const errors = {}
  if (!values.firstName) {
    errors.firstName = 'Required'
  }
  if (!values.lastName) {

santosh-btc

<div>
  <label>First Name</label>
  <div>
    <Field
      name="firstName"
      component={renderField}
      type="text"
      placeholder="First Name"
    />
  </div>

santosh-btc

const renderField = ({
  input,
  type,
  meta: { touched, error }
}) => (
  <div>
    <label>{label}</label>
    <div>
      <input {...input} placeholder={label} type={type} />
        {touched && error && <span>{error}</span>}

santosh-btc

function validate(values) {
  const errors = {}
  if (!values.firstName) {
    errors.firstName = 'Required'
  }
  return errors
}

santosh-btc

<div>
  <label>First Name</label>
  <div>
    <Field
      name="firstName"
      component="input"
      type="text"
      placeholder="First Name"
    />
  </div>

santosh-btc

const sleep = ms => new Promise(resolve => setTimeout(resolve, ms));

export default (async function showResults(values) {
  await sleep(500);
  window.alert(`You submitted:\n\n${JSON.stringify(values, null, 2)}`);
});

santosh-btc

import React, { Component } from 'react';
import { Provider } from "react-redux";
import store from "./store";
import showResults from "./showResults";
import SimpleForm from "./SimpleForm";

class App extends Component {
  render() {
    return (
      <Provider store={store}>

santosh-btc

import React from 'react';
import { Field, reduxForm } from 'redux-form';

const SimpleForm = props => {
  const { handleSubmit, pristine, reset, submitting } = props;
  return (
    <form onSubmit={handleSubmit}>
      <div>
        <label>First Name</label>
        <div>

santosh-btc

import { createStore, combineReducers } from 'redux';
import { reducer as reduxFormReducer } from 'redux-form';

const reducer = combineReducers({
  form: reduxFormReducer,
});
const store = (window.devToolsExtension
  ? window.devToolsExtension()(createStore)
  : createStore)(reducer);

santosh-btc

/*
 * Ruby's String#center, String#rjust, String#ljust
 * 
 * https://jsfiddle.net/6v0bpffm/
 */

function ljust( string, width, padding ) {
	padding = padding || " ";
	padding = padding.substr( 0, 1 );
	if ( string.length < width )