Made errorMessage a property that can be set outside of component. Al…

…so updated docs to reflect all avaialble props.
holidayextras · Jun 9, 2015 · ac7205c · ac7205c
1 parent 5d15c20
commit ac7205c
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 14 deletions.
diff --git a/docs/src/Components.jsx b/docs/src/Components.jsx
@@ -88,6 +88,11 @@ var Components = React.createClass({
           <h4>Attributes</h4>
           <ul>
             <li><code>defaultValue</code> [optional] String - MM/YY Expiration Date</li>
+            <li><code>formatInput</code> [optional] Boolean - Default false,</li>
+            <li><code>placeHolder</code> [optional] String - Default  'MM / YY',</li>
+            <li><code>name</code> [optional] String - Default 'credit-card-expire',</li>
+            <li><code>id</code> [optional] String - Default 'credit-card-expire',</li>
+            <li><code>errorMessage</code> [optional] String - Default 'Invalid Expiration Date'</li>
           </ul>
         </article>
 

diff --git a/src/components/credit-card-expire/code/views/creditCardExpireView.jsx b/src/components/credit-card-expire/code/views/creditCardExpireView.jsx
@@ -12,7 +12,8 @@ module.exports = React.createClass({
     defaultValue: React.PropTypes.string,
     name: React.PropTypes.string,
     id: React.PropTypes.string,
-    valid: React.PropTypes.bool
+    valid: React.PropTypes.bool,
+    errorMessage: React.PropTypes.string
   },
 
   getInitialState: function() {
@@ -27,40 +28,34 @@ module.exports = React.createClass({
       formatInput: false,
       placeHolder: 'MM / YY',
       name: 'credit-card-expire',
-      id: 'credit-card-expire'
+      id: 'credit-card-expire',
+      errorMessage: 'Invalid Expiration Date'
     };
   },
 
   handleChange: function(elm){
 
-    if( !this.formatting)
-    {
+    if( !this.formatting){
       this.formatting = true;
       Payment.formatCardExpiry(document.querySelector('.credit-card-expire-input'));
     }
 
     var expires = elm.target.value;
-    var is_valid = false;
+    var is_valid = true;
     var self = this;
 
-    if(expires.length > 0)
-    {
+    if(expires.length > 0){
       var date = expires.split(' / ');
-      if(date.length === 2)
-      {
+      if(date.length === 2){
         is_valid = Payment.fns.validateCardExpiry(date[0], date[1]);
       }
     }
-    else
-    {
-      is_valid = true;
-    }
 
     clearTimeout(this.intent);
     this.intent = setTimeout(function(){
       self.setState({
         valid: is_valid,
-        error: (is_valid) ? null : 'Invalid Expiration Date'
+        error: (is_valid) ? null : self.props.errorMessage
       });
     }, 500);
   },