From eec652323c7c081d19478733193d8872a4e47e0e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Paul=20O=E2=80=99Shannessy?= <paul@oshannessy.com>
Date: Tue, 16 Jul 2013 23:29:39 -0700
Subject: [PATCH] Cleanup "Forms"

---
 docs/06-forms.md | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/docs/06-forms.md b/docs/06-forms.md
index 150ccb6a..c851a852 100644
--- a/docs/06-forms.md
+++ b/docs/06-forms.md
@@ -6,8 +6,10 @@ permalink: forms.html
 prev: reusable-components.html
 next: working-with-the-browser.html
 ---
+
 Form components such as `<input>`, `<textarea>`, and `<option>` differ from other native components because they can be mutated via user interactions. These components provide interfaces that make it easier to manage forms in response to user interactions.
 
+
 ## Interactive Props
 
 Form components support a few props that are affected via user interactions:
@@ -26,6 +28,7 @@ Form components allow listening for changes by setting a callback to the `onChan
 
 Like all DOM events, the `onChange` prop is supported on all native components and can be used to listen to bubbled change events.
 
+
 ## Controlled Components
 
 An `<input>` with `value` set is a *controlled* component. In a controlled `<input>`, the value of the rendered element will always reflect the `value` prop. For example:
@@ -42,12 +45,12 @@ This will render an input that always has a value of `Hello!`. Any user input wi
   getInitialState: function() {
     return {value: 'Hello!'};
   },
+  handleChange: function(event) {
+    this.setState({value: event.target.value});
+  },
   render: function() {
     var value = this.state.value;
     return <input type="text" value={value} onChange={this.handleChange} />;
-  },
-  handleChange: function(event) {
-    this.setState({value: event.target.value});
   }
 ```
 
@@ -61,6 +64,7 @@ In this example, we are simply accepting the newest value provided by the user a
 
 This would accept user input but truncate the value to the first 140 characters.
 
+
 ## Uncontrolled Components
 
 An `<input>` that does not supply a `value` (or sets it to `null`) is an *uncontrolled* component. In an uncontrolled `<input>`, the value of the rendered element will reflect the user's input. For example:
@@ -85,8 +89,10 @@ This example will function much like the **Controlled Components** example above
 
 Likewise, `<input>` supports `defaultChecked` and `<option>` supports `defaultSelected`.
 
+
 ## Advanced Topics
 
+
 ### Why Controlled Components?
 
 Using form components such as `<input>` in React presents a challenge that is absent when writing traditional form HTML. For example, in HTML:
@@ -107,6 +113,7 @@ Unlike HTML, React components must represent the state of the view at any point
 
 Since this method describes the view at any point in time, the value of the text input should *always* be `Untitled`.
 
+
 ### Why Textarea Value?
 
 In HTML, the value of `<textarea>` is usually set using its children: