Javascript ng submit按钮未调用AngularJS函数单击
我有一个带有表单和提交的引导模式,但不会调用AngularJS控制器中定义的函数。我能够读取并显示页面上的数据,但当我单击提交按钮时,什么也没有发生。它刚刚关闭。为了进行测试,我尝试在单击submit按钮时console.log一条消息。多谢各位 AngularJS:Javascript ng submit按钮未调用AngularJS函数单击,javascript,angularjs,Javascript,Angularjs,我有一个带有表单和提交的引导模式,但不会调用AngularJS控制器中定义的函数。我能够读取并显示页面上的数据,但当我单击提交按钮时,什么也没有发生。它刚刚关闭。为了进行测试,我尝试在单击submit按钮时console.log一条消息。多谢各位 AngularJS: var app = angular.module('myApp', []); app.controller('supportController', function($scope, $http) {
var app = angular.module('myApp', []);
app.controller('supportController',
function($scope, $http) {
$scope.updateList = function() {
console.log('updateList function invoked!');
};
$http({
method: 'GET',
url: ".../_api/web/lists/GetByTitle('DCO-%20IT%20Issue%20Tracker')/items?",
headers: {"Accept": "application/json;odata=verbose"}
}).then(function (data, status, headers, config) {
$scope.tickets = data.data.d.results;
$scope.tickets.map(ticket => console.log(ticket));
}, function errorCallback(response) {
console.log(response);
});
});
HTML:
提交问题/申请单
标题
网络
细节
{{ticket.Title}
{{ticket.Network}
{{ticket.Details}
DISA欧洲-欧盟34支持请求
&时代;
提交人
标题
网络
细节
提交
接近
我认为有两件事需要在模板中改进,以使其相应地工作:
- 将
包装在 - 从
中删除
属性,以防止提交+重新加载页面的默认操作操作
// ...
提交
接近
删除数据撤销属性表单“提交”按钮允许调用该功能。尝试从表单中删除“操作=”“
<div class="container" ng-controller="supportController">
<div class="row">
<div class="col-12">
<button class="btn btn-secondary btn-block" data-toggle="modal" data-target="#myModal">Submit Issue/Request Ticket</button>
</div>
</div>
<div class="row">
<div class="col-12">
<table id="searchTextResults" class="table table-striped">
<tr>
<th>Title</th>
<th>Network</th>
<th>Details</th>
</tr>
<tr ng-repeat="ticket in tickets">
<td>{{ticket.Title}}</td>
<td>{{ticket.Network}}</td>
<td>{{ticket.Details}}</td>
</tr>
</table>
</div>
</div>
<!-- The Modal -->
<div class="modal" id="myModal">
<div class="modal-dialog">
<div class="modal-content">
<!-- Modal Header -->
<div class="modal-header">
<h4 class="modal-title">DISA Europe - EU34 Support Request</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<!-- Modal body -->
<div class="modal-body">
<form action="" method="POST" ng-submit="updateList()">
<div class="form-group">
<!-- <label>Title</label> -->
<div>
<lable>Submitted By</lable>
<div id="user"></div>
</div>
</div>
<div class="form-group">
<label>Title</label>
<div>
<input type="text" class="form-control input-lg" name="title" id="title">
</div>
</div>
<div class="form-group">
<label>Network</label>
<div>
<input type="text" class="form-control input-lg" name="network" id="network">
</div>
</div>
<div class="form-group">
<label>Details</label>
<div>
<input type="text" class="form-control input-lg" name="details" id="details">
</div>
</div>
</form>
</div>
<!-- Modal footer -->
<div class="modal-footer">
<button type="submit" class="btn btn-primary" data-dismiss="modal">Submit</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>