無法使用Angular.js激活Enter鍵

Question

我有一個關於使用Angular.js.激活Enter鍵的問題，我在下面解釋我的代碼。

<form name="billdata" id="billdata" enctype="multipart/form-data" novalidate ng-submit="addProfileData(billdata);" > 
<div id="SHOWDATA"> 
<div id="transactionsPortlet" class="panel-collapse collapse in"> 
<div class="portlet-body"> 
<div class="totalaligndiv"> 
<div class="col-md-6"> 

<div class="input-group bmargindiv1 col-md-12"> 
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">College Title :</span> 
<input type="text" name="colgmname" id="procolgtitle" class="form-control" placeholder="Add College Title" ng-model="colgname" ng-keypress="clearField('procolgtitle');" maxlength="50"> 
</div> 

<div class="input-group bmargindiv1 col-md-12"> 
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">College Subtitle :</span> 
<input type="text" name="subtitle" id="procolgsubtitle" class="form-control" placeholder="Add College Subtitle" ng-model="shortname" ng-keypress="clearField('procolgsubtitle');" maxlength="30"> 
</div> 

<div class="input-group bmargindiv1 col-md-12"> 
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">Mobile No (10 digits) :</span> 
<div ng-class="{ 'myError': billdata.mobno.$touched && billdata.mobno.$invalid }"> 
<input type="text" name="mobno" id="procolgcontactno" class="form-control" placeholder="Add Mobile No" ng-model="contno" ng-pattern="/^[0-9]{10,10}$/" ng-keypress="clearField('procolgcontactno');" > 
</div> 
</div> 
<div class="help-block" ng-messages="billdata.mobno.$error" ng-if="billdata.mobno.$touched"> 
<p ng-message="pattern" style="color:#F00;">Please add a valid 10 digit mobile no.</p> 
</div> 
<div class="input-group bmargindiv1 col-md-12"> 
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">Email Address :</span> 
<div ng-class="{ 'myError': billdata.email.$touched && billdata.email.$invalid }"> 
<input type="email" name="email" id="procolgmail" class="form-control" placeholder="Add Email Address" ng-model="colgemail" ng-pattern="/^[_a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$/" ng-keypress="clearField('procolgmail');" maxlength="50"> 
</div> 
</div> 
<div class="help-block" ng-messages="billdata.email.$error" ng-if="billdata.email.$touched"> 
<p ng-message="email" style="color:#F00;">This needs to be a valid email</p> 
<p ng-message="pattern" style="color:#F00;">This field needs valid email format(e.g-abc@gmail.com).</p> 
</div> 
</div> 
<div class="col-md-6"> 
<div class="input-group bmargindiv1 col-md-12"> 
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">College Code :</span> 
<input type="text" name="colgcode" id="procolgcode" class="form-control" placeholder="Add College Code" ng-model="colgcode" ng-keypress="clearField('procolgcode');" maxlength="30" > 
</div> 
<div class="input-group bmargindiv1 col-md-12"> 
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">College Address :</span> 
<textarea id="procolgaddress" name="address" class="form-control" placeholder="Add College Address" rows="5" ng-model="address" style="height:122px" ng-keypress="clearField('procolgaddress');"></textarea> 
</div> 
</div> 

<div class="clearfix"></div>  
<div style="text-align:center; padding-top:10px;"> 
<input type="button" class="btn btn-success" ng-click="addProfileData(billdata);" id="addProfileData" ng-value="buttonName"/> 
<input type="button" class="btn btn-red" ng-click="clearProfileData();" id="addProfileData" ng-value="ClearbuttonName" ng-show="showCancel"/> 
</div> 

<div class="clearfix"></div>  

</div> 
</div> 
</div> 
</div> 

</form> 

工作形式：

<form name="billdata" id="billdata" enctype="multipart/form-data" novalidate ng-submit="addSectionData();"> 
<div id="SHOWDATA"> 
<div id="transactionsPortlet" class="panel-collapse collapse in"> 
<div class="portlet-body"> 
<div class="totalaligndiv"> 


<div class="col-md-6"> 
<div class="input-group bmargindiv1 col-md-12"> 
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">College Name :</span> 
<select class="form-control" id="colg_name" ng-model="colg_name" ng-options="colg.name for colg in listOfCollege track by colg.value " ng-change="removeBorder('colg_name',colg_name);" ng-readonly="colgread" ng-disabled="colgdis"> 
</select> 
</div> 
</div> 
<div class="col-md-6"> 
<div class="input-group bmargindiv1 col-md-12"> 
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">Section Name</span> 
<input type="text" name="colgmname" id="resourcesection" class="form-control" placeholder="Add section" ng-model="section" ng-keypress="clearField('resourcesection');" > 
</div> 
</div> 
<div class="clearfix"></div>  
<div style="text-align:center; padding-top:10px;"> 
<input type="button" class="btn btn-success" ng-click="addSectionData();" id="addProfileData" ng-value="buttonName"/> 
<input type="button" class="btn btn-red" ng-click="cancelSectionData();" id="addProfileData" ng-value="cancelbuttonName" ng-show="showCancel"/> 
</div> 

<div class="clearfix"></div>  

</div> 
</div> 
</div> 
</div> 
</form> 

在這種形式下，當我按下enter鍵沒有什麼是happening.Here我需要兩個按鈕，點擊Enter鍵提交form.Please幫我解決這個問題。

Answer 1

你有按鈕。我認爲應該提交按鈕

更換

<input type="button" class="btn btn-success" ng-click="addProfileData(billdata);" id="addProfileData" ng-value="buttonName"/> 

與

<input type="submit" class="btn btn-success" id="addProfileData" ng-value="buttonName"/> 

否則，如果你可以用打擊提到的指令。

angular.module('NgEnter', []) 
    .directive('ngEnter', function() { 
     return function(scope, element, attrs) { 
      element.bind("keypress", function(e) { 
       if(e.which === 13) { 
        scope.$apply(function(){ 
         scope.$eval(attrs.ngEnter, {'e': e}); 
        }); 
        e.preventDefault(); 
       } 
      }); 
     }; 
    }); 

比你可以這樣調用它：

<form name="billdata" id="billdata" enctype="multipart/form-data" novalidate ng-enter="addProfileData(billdata);" >