Update uncontrolled example

aerian-studios · Sep 19, 2018 · 197b0aa · 197b0aa
1 parent 5783835
commit 197b0aa
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 6 deletions.
diff --git a/week17/uncontrolledForm/App.js b/week17/uncontrolledForm/App.js
@@ -7,8 +7,6 @@ export class App extends Component {
     constructor (props) {
         super(props);
         this.fields = {};
-
-        this.handleSubmit = this.handleSubmit.bind(this);
     }
 
     gatherData () {
@@ -24,13 +22,13 @@ export class App extends Component {
         return (
             <div className="field">
                 <label className="field__label" htmlFor={ filedId }>{ filedText }</label>
-                <input 
+                <input
                     id ={ filedId } 
                     required 
                     type="text"
                     maxLength="50"
                     className="field__input field__input--text"
-                    ref={ (e) => this.fields.postcode = e } />
+                    ref={ (e) => this.fields[filedId] = e } />
             </div>
         )
     }
@@ -39,15 +37,15 @@ export class App extends Component {
         return (
             <footer className="footer">
                 <span className="footer__error">Passwords do not match</span>
-                <button className="footer__button" disabled type="submit">Submit</button>
+                <button className="footer__button" type="submit">Submit</button>
             </footer>
         )
     }
 
     render() {
         return (
             <div className="conatiner">
-                <form id="form" className="form" onSubmit={this.handleSubmit}>
+                <form className="form" onSubmit={ (e)=> { this.handleSubmit(e) }}>
                     <h1 className="form__header">Would you like to know more?</h1>
                     <fieldset className="form_fieldset">
                         { this.renderField("Username", "username") }

diff --git a/week17/uncontrolledForm/styles.css b/week17/uncontrolledForm/styles.css
@@ -7,6 +7,7 @@
     box-sizing: border-box;
     margin: 32px;
     font-family: Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;
+    text-align: left;
 }
 
 .form__header {