0

我有一个关于使用 Angular.js 激活输入键的问题。我在下面解释我的代码。

<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键时，什么都没有发生。这里我需要单击按钮和Enter键来提交表单。请帮我解决这个问题。

4

1 回答 1

0

你有按钮。我认为应该是提交按钮

代替

<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);" >
于 2015-11-30T05:05:07.800 回答