Angularjs $uibModal尝试在我的表单中强制执行提交
我有一个模态对话框,是用ui.bootstrap创建的。当我使用Angularjs $uibModal尝试在我的表单中强制执行提交,angularjs,angular-ui-bootstrap,Angularjs,Angular Ui Bootstrap,我有一个模态对话框,是用ui.bootstrap创建的。当我使用$uibModal或$uibModalInstance执行某些代码时,在此模式的控制器内部,AngularJS尝试从对话框调用我的的提交方法。另外,我的没有submit属性,但它有ng submit属性 以下是我的模态对话框的一部分: <div class="modal-content"> <form name="newActionForm" class="form-horizontal" role="fo
$uibModal
或$uibModalInstance
执行某些代码时,在此模式的控制器内部,AngularJS尝试从对话框调用我的
的提交方法。另外,我的
没有submit
属性,但它有ng submit
属性
以下是我的模态对话框的一部分:
<div class="modal-content">
<form name="newActionForm" class="form-horizontal" role="form" ng-submit="">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title">{{ 'action.labelNewAction' | translate }}</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label class="col-sm-3 control-label site-form-label">{{ 'common.labelName' | translate }}:</label>
<div class="col-sm-9 input-group padding_right_left_15" ng-class=" newActionForm.name.$valid ? 'has-success' : 'has-error' ">
<input required ng-maxlength="160" ng-change="vm.test()" name="name" class="form-control" ng-model="vm.newAction.name"/>
<span class="input-group-addon">
<i class="glyphicon glyphicon-remove" ng-show="newActionForm.name.$error.required" tooltip="{{'formValidationRequired' | translate}}"></i>
<i class="glyphicon glyphicon-remove" ng-show="newActionForm.name.$error.maxlength" tooltip="{{'formValidationNameTooLong' | translate}}"></i>
<i class="glyphicon glyphicon-ok" ng-show="newActionForm.name.$valid"></i>
</span>
</div>
</div>
</div>
<div class="modal-footer">
<button ng-disabled="newActionForm.$invalid" class="btn btn_kassir" ng-click="vm.addAction()">{{ 'common.labelButtonAdd' | translate }}</button>
<button class="btn btn-default" ng-click="close()">{{ 'common.labelButtonClose' | translate }}</button>
</div>
</form>
</div>
该问题已解决,之所以发生,是因为默认情况下,
$uibModal.open()
方法使用
创建了一个模态。因此,在将$uibModal.open()
转换为后,必须在模式范围内创建submit函数,并将函数分配为ng submit=“someFunction()”,然后它将work@Ahmer我的问题不是我不能执行提交操作,这是一个在没有我的命令的情况下执行提交的问题。我知道了。创建一个隐藏输入标记,类型为submit。当你按下时,它将提交你的表单enter@Ahmer此解决方法对我不好,因为当我尝试执行$uibModalInstance.close()
时,由于必填字段,模态无法关闭,那可以是空的。节省了我几个小时!非常感谢。
angular
.module('newActionDialog')
.controller('NewActionDialogController',
[ '$scope', '$stateParams', '$uibModalInstance', 'Requester', '$uibModal', '$filter', '$translate', 'alertService', NewActionDialogController]);
function NewActionDialogController($scope, $stateParams, $uibModalInstance, Requester, $uibModal, $filter, $translate, alertService) {
var vm = this;
vm.showSelectHall=function(){
$uibModal.open({
templateUrl: 'app/repertoire/listHalls.html',
controller: function ($scope, $uibModalInstance) {
this.select = function (hallConfig) {
$uibModalInstance.close(hallConfig);
};
},
controllerAs: 'ctrl',
}).result.then(function (hallConfig) {
vm.newAction.defaultHallConfiguration=hallConfig;
});
};
......
vm.close=function(){
$uibModalInstance.close();
}
}