Forms - Inline Forms

kushalsng · Nov 17, 2016 · 3dcf277 · 3dcf277
1 parent 4a1aed8
commit 3dcf277
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 5 deletions.
diff --git a/README.md b/README.md
@@ -80,3 +80,4 @@ There are no code listings in this chapter.
    * Navigation [Full source](../../tree/10-navigation) | [Diffs from previous step](../../compare/10-bootstrap-installation...10-navigation)
    * Table and Panel [Full source](../../tree/10-table-and-panel) | [Diffs from previous step](../../compare/10-navigation...10-table-and-panel)
    * Forms - Grid Based Forms [Full source](../../tree/10-forms--grid-based-forms) | [Diffs from previous step](../../compare/10-table-and-panel...10-forms--grid-based-forms)
+   * Forms - Inline Forms [Full source](../../tree/10-forms--inline-forms) | [Diffs from previous step](../../compare/10-forms--grid-based-forms...10-forms--inline-forms)
diff --git a/src/IssueAdd.jsx b/src/IssueAdd.jsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import { Form, FormControl, Button } from 'react-bootstrap';
 
 export default class IssueAdd extends React.Component {
   constructor() {
@@ -22,11 +23,13 @@ export default class IssueAdd extends React.Component {
   render() {
     return (
       <div>
-        <form name="issueAdd" onSubmit={this.handleSubmit}>
-          <input type="text" name="owner" placeholder="Owner" />
-          <input type="text" name="title" placeholder="Title" />
-          <button>Add</button>
-        </form>
+        <Form inline name="issueAdd" onSubmit={this.handleSubmit}>
+          <FormControl name="owner" placeholder="Owner" />
+          {' '}
+          <FormControl name="title" placeholder="Title" />
+          {' '}
+          <Button type="submit" bsStyle="primary">Add</Button>
+        </Form>
       </div>
     );
   }