From 4b784a0072edcc437f53117babe1bd7fd1cc51f6 Mon Sep 17 00:00:00 2001
From: Supasak Sutha <supasak@localhost.localdomain>
Date: Tue, 31 Oct 2017 14:02:14 +0700
Subject: [PATCH] FIX: Year navigation cause form submit if component placed in
 side form.

---
 src/app.jsx  | 34 ++++++++++++++++++----------------
 src/year.jsx |  2 ++
 2 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/src/app.jsx b/src/app.jsx
index 2c71e2b..235ca43 100644
--- a/src/app.jsx
+++ b/src/app.jsx
@@ -64,22 +64,24 @@ class App extends React.Component {
   }
   render() {
     return (
-      <div className="month-picker">
-        <Picker
-          selectedDateRange={this.state.selectedDateRange.clone()} onClick={this.handleClickFn}
-        />
-        <Calendar
-          selectedDateRange={this.state.selectedDateRange.clone()}
-          restrictionRange={this.state.restrictionRange.clone()}
-          display={this.state.display}
-          onSelect={this.onSelectFn}
-          onApply={this.onApplyFn}
-          onCancel={this.onCancelFn}
-          direction={this.props.direction}
-          onYearChange={this.props.onYearChange}
-          position={this.props.position}
-        />
-      </div>
+      <form onSubmit={() => alert('Submitted')}>
+        <div className="month-picker">
+          <Picker
+            selectedDateRange={this.state.selectedDateRange.clone()} onClick={this.handleClickFn}
+          />
+          <Calendar
+            selectedDateRange={this.state.selectedDateRange.clone()}
+            restrictionRange={this.state.restrictionRange.clone()}
+            display={this.state.display}
+            onSelect={this.onSelectFn}
+            onApply={this.onApplyFn}
+            onCancel={this.onCancelFn}
+            direction={this.props.direction}
+            onYearChange={this.props.onYearChange}
+            position={this.props.position}
+          />
+        </div>
+      </form>
     );
   }
 }
diff --git a/src/year.jsx b/src/year.jsx
index 94fcb9c..65381b1 100644
--- a/src/year.jsx
+++ b/src/year.jsx
@@ -99,6 +99,7 @@ class YearBase extends React.Component {
             <button
               className="btn btn-plain year-down pull-left"
               onClick={this.reduceYear}
+              type="button"
             >
               <i className="fa fa-chevron-circle-left" />
             </button>
@@ -106,6 +107,7 @@ class YearBase extends React.Component {
             <button
               className="btn btn-plain year-up pull-right"
               onClick={this.incYear}
+              type="button"
             >
               <i className="fa fa-chevron-circle-right" />
             </button>