2015-10-06 57 views
1

我在使用带有角度js登录表单的键盘上的'输入按钮'时遇到问题。我知道这个问题之前曾被问过,但我相信我的问题有点不同,因为我几乎试过了写在stackoverflow问题上的所有内容。按Enter键不适用于AngularJS

所以,我只想用键盘上的回车键来敲击输入并提交表格。

这里登陆HTML:

<!-- BEGIN LOGIN FORM --> 
<form ng-submit="loginCtrl.login()" class="login-form"> 
    <h3 class="form-title">Sign In</h3> 
    <div class="alert alert-danger display-hide"> 
     <button class="close" data-close="alert"></button> 
      <span> 
      Enter any username and password. </span> 
    </div> 
    <div class="form-group"> 
     <!--ie8, ie9 does not support html5 placeholder, so we just show field title for that--> 
     <label class="control-label visible-ie8 visible-ie9">Username</label> 
     <input class="form-control form-control-solid placeholder-no-fix" type="text" autocomplete="off" placeholder="Company/username" 
       ng-model="loginCtrl.username" name="username"/> 
    </div> 
    <div class="form-group"> 
     <label class="control-label visible-ie8 visible-ie9">Password</label> 
     <input class="form-control form-control-solid placeholder-no-fix" type="password" autocomplete="off" placeholder="Password" 
       ng-model="loginCtrl.password" name="password"/> 
    </div> 
    <div class="form-actions"> 
     <input type="submit" class="btn btn-success uppercase" value="Login"> 
    </div> 

    </form> 
<!-- END LOGIN FORM --> 

,这里是我的登录名:

self.login = function() { 

     var result = self.username.split("/"); 
     var account = result[0]; 
     var userId = result[1]; 

      UserService.login(userId, self.password,account).then(function(user) { 
      self.userAccount = user; 

      $state.go('home'); 

     }, function(err) { 
      alert("Authentication failure: Please check your credentials. ") 
     }); 

我得到的用户名 “的companyName /用户名”,所以它是这样的: 亚马逊/ bigboby

+0

你可以提供一个plunkr? –

+1

没有什么不寻常的可以阻止它的html。你确定问题不在你的提交功能中吗?创建一个复制你的问题的演示,并提供更好的问题描述 – charlietfl

+1

和您的窗体应该有一个名称为角形式指令还 – charlietfl

回答

1

我很确定你的问题是由这个<button>标签造成的:

<button class="close" data-close="alert"></button> 

答案在documentation发现:

您可以使用以下两种方式之一,以指定当表单提交JavaScript方法应该叫:

ngSubmit指令的形式在第一按钮或输入字段类型的提交元件

ngClick指令(输入[类型=提交])

请注意关于如何在第一个按钮上查找ng-click处理程序的注释。当您按ENTER提交表单时,Angular会查看表单并看到该按钮。它会在该按钮上执行ng-click处理程序(如果有的话)。

如果包含按钮上的type属性,可以防止并让它找到实际的提交按钮:

<button type="button" class="close" data-close="alert"></button> 
+0

非常感谢,我想这很有道理,如果表单中有多个按钮, 。所以只要输入'type =“button”'就可以正常工作。 –