login & register form are now being submitted when pressing the 'enter' key

front-ui/app/components/account/login.js

@@ -52,8 +52,11 @@ var Login = React.createClass({
     renderErrorMessage: function(message){
         return (<div className='error-message'>{message}</div>)
     },
-    doLogin: function(e) {
+    onLoginClick: function(e) {
-        
+        this.doLogin();
+        e.preventDefault();
+    },
+    doLogin: function() {
         if(this.validate()) {
             var loginInfo = new LoginModel({
                 email: this.state.email,
@@ -63,8 +66,6 @@ var Login = React.createClass({
             UserActions.userLogin(loginInfo);
 
         }
-
-        e.preventDefault();
     },
     renderLoginFailure: function() {
 
@@ -75,6 +76,12 @@ var Login = React.createClass({
 
         return (<div></div>)
     },
+    onKeyPress: function(e) {
+     var enterKeyCode = 13;
+        if(e.which == enterKeyCode) {
+            this.doLogin();
+        }
+    },
     render : function() {
         return (<div>
                 <div className="col-md-6">
@@ -86,18 +93,18 @@ var Login = React.createClass({
 
                 <div className="form-group">
                 <label for="email">Email adresa</label>
-                <input type="email" onChange={this.handleChange('email')} className="form-control" id="email" placeholder="Unesite email"></input>
+                <input type="email" onKeyPress={this.onKeyPress} onChange={this.handleChange('email')} className="form-control" id="email" placeholder="Unesite email"></input>
 
                 {this.getValidationMessages('email').map(this.renderErrorMessage)}
                 </div>
                 <div className="form-group">
                 <label for="password">Šifra</label>
-                <input type="password" onChange={this.handleChange('password')} className="form-control" id="password" placeholder="Šifra"></input>
+                <input type="password" onKeyPress={this.onKeyPress} onChange={this.handleChange('password')} className="form-control" id="password" placeholder="Šifra"></input>
 
                 {this.getValidationMessages('password').map(this.renderErrorMessage)}
                 </div>
                 <div className="form-group">
-                <button type="button" onClick={this.doLogin} className="btn btn-success">Prijava</button>
+                <button type="button" onClick={this.onLoginClick} className="btn btn-success">Prijava</button>
                 </div>
                 </form>
                 </div>

front-ui/app/components/account/register.js

@@ -32,6 +32,12 @@ var Register = React.createClass({
       myBabyOnTheWay: (e.currentTarget.value === "1" ? true: false)
     });
   },
+  onKeyPress: function(e) {
+      var enterKeyCode = 13;
+      if(e.which == enterKeyCode) {
+          this.doRegister();
+      }
+  },
   renderMonthSelector: function() {
     var months = ['Januar', 'Februar', 'Mart', 'April', 'Maj', 'Juni',
     'Juli','August','Septembar', 'Oktobar','Novembar','Decembar'];
@@ -194,7 +200,11 @@ var Register = React.createClass({
           loginState : UserStore.getLoginState()
       });
   },
-  register: function(e) {
+  onRegisterClick: function(e) {
+    this.doRegister();
+    e.preventDefault();
+  },
+  doRegister: function() {
     if(this.validate()) {
       var children = [];
       if (this.state.myBabyDetailsVisible) {
@@ -231,8 +241,6 @@ var Register = React.createClass({
 
       UserActions.registerUser(user);
     }
-
-    e.preventDefault();
   },
   successContinue: function(e) {
     NavigationActions.goToHome();
@@ -284,7 +292,7 @@ var Register = React.createClass({
         <div className="form-group">
             <label for="firstName" className="col-md-4 control-label">Ime</label>
             <div className="col-md-4">
-              <input type="text" onChange={this.handleChange('firstName')} className="form-control" id="firstName" placeholder="Ime"/>
+              <input type="text" onKeyPress={this.onKeyPress} onChange={this.handleChange('firstName')} className="form-control" id="firstName" placeholder="Ime"/>
               {this.getValidationMessages('firstName').map(this.renderErrorMessage)}
             </div>
         </div>
@@ -292,28 +300,28 @@ var Register = React.createClass({
         <div className="form-group">
             <label for="lastName" className="col-md-4 control-label">Prezime</label>
             <div className="col-md-4">
-              <input type="text" onChange={this.handleChange('lastName')} className="form-control" id="lastName" placeholder="Prezime"/>
+              <input type="text" onKeyPress={this.onKeyPress} onChange={this.handleChange('lastName')} className="form-control" id="lastName" placeholder="Prezime"/>
               {this.getValidationMessages('lastName').map(this.renderErrorMessage)}
             </div>
         </div>
         <div className="form-group">
             <label for="email" className="col-md-4 control-label">Email</label>
             <div className="col-md-4">
-              <input type="text" onChange={this.handleChange('email')} className="form-control" id="email" placeholder="Email Adresa"/>
+              <input type="text" onKeyPress={this.onKeyPress} onChange={this.handleChange('email')} className="form-control" id="email" placeholder="Email Adresa"/>
               {this.getValidationMessages('email').map(this.renderErrorMessage)}
             </div>
         </div>
         <div className="form-group">
             <label for="password" className="col-md-4 control-label">Šifra</label>
             <div className="col-md-4">
-              <input type="password"  onChange={this.handleChange('password')} className="form-control" id="password" placeholder="Šifra"/>
+              <input type="password" onKeyPress={this.onKeyPress} onChange={this.handleChange('password')} className="form-control" id="password" placeholder="Šifra"/>
               {this.getValidationMessages('password').map(this.renderErrorMessage)}
             </div>
         </div>
         <div className="form-group">
             <label for="password_confirmation" className="col-md-4 control-label">Potvrda šifre</label>
             <div className="col-md-4">
-              <input type="password" onChange={this.handleChange('passwordConfirmation')} className="form-control" id="password_confirmation" placeholder="Podvrda šifre"/>
+              <input type="password"  onKeyPress={this.onKeyPress} onChange={this.handleChange('passwordConfirmation')} className="form-control" id="password_confirmation" placeholder="Podvrda šifre"/>
 
 
               {this.getValidationMessages('passwordConfirmation').map(this.renderErrorMessage)}
@@ -335,7 +343,7 @@ var Register = React.createClass({
 
             </div>
             <div className="col-md-4">
-            <button onClick={this.register} type="button" className="btn btn-success btn-lg">
+            <button onClick={this.onRegisterClick} type="button" className="btn btn-success btn-lg">
             Registruj me
             </button>
             </div>