在Angular JS中按键时提交表单

时间:2014-12-16 06:18:32

标签: javascript jquery angularjs

我有一个登录表格如下。登录控制器在单击登录按钮时调用,并且工作正常。输入用户名和密码后,我需要在“Enter”键上调用相同的功能。

  <form class="form-horizontal">
   <fieldset>
   <div class="form-group">
     <input type="text"
        class="form-control input-lg input-round text-center"
        placeholder="Username"
        ng-model="uservals">
   </div>
  <div class="form-group">
     <input type="password"
        class="form-control input-lg input-round text-center"
        placeholder="Password"
        ng-model="passvals">
  </div>
  <div class="form-group">
     <a href="#/" class="btn btn-primary btn-lg btn-round btn-block text-center" ng-click="log_me()">Log in</a>
  </div>
  </fieldset>
  </form>

控制器

var mysession = '';
function loginController($scope, $http, $cookieStore, $location) {
$scope.sess_id = mysession;
var token = $cookieStore.get('token');
var conId = $cookieStore.get('Cont_Id');
var exId = $cookieStore.get('ex_Id');
$scope.log_me = function() {
    $scope.login_me = [];
    var login_un = $scope.uservals;
    var login_pwd = $scope.passvals;
    var logs_me = "http://www.vb.com/login.html?username=" + login_un + "&password=" + login_pwd;
    $http.get(logs_me)
        .success(function(response) {
            $cookieStore.put('token', response.token);
            $cookieStore.put('ex_Id', response.ExId);
            $cookieStore.put('Cont_Id', response.contactId);
            $cookieStore.put('email', response.email);
            $cookieStore.put('name', response.name);
            mysession = response.ss_id;
            if (response.status == "failure") {
                $('.login_error').show();
                $('.login_error').html('Invalid username or password');
                $('.login_error').delay(4000).fadeOut();
                $('.loading').hide();
            } else {
                $('.page-signin').hide();
                $('.signin-header').hide();
                $location.path('/dashboard');
                }
              });
      }
  }

1 个答案:

答案 0 :(得分:4)

<强> Demo

像这样更改你的表格;

<form class="form-horizontal" ng-submit="log_me()">

然后更新按钮以提交如下按钮;

<input type="submit" class="btn btn-primary btn-lg btn-round btn-block text-center" value="Log in"/>

当您单击Enter键时,这将自动提交您的表单。