Angular Form submit按钮仅在第二次单击时触发
Angular Form submit按钮仅在第二次单击时触发
提问于 2017-12-11 07:26:36
我正在构建一个小网页，它可以对API进行一些查询。如果所有输入的数据都是有效的，则在单击submit按钮时进行查询。然而，当我从一组独立的元素(文本框，选择框，按钮)调整表单时，我开始不得不点击“搜索”一次，然后再次点击它才能触发函数。
这是怎么回事/我该怎么解决这个问题？
HTML：
<div id="search" class="centerWrapper">
<div id="searchArea" class="searchArea">
<input type="text" class="inputBox" name="charName" ng-model="charName" placeholder="Character Name"></input>
<select class="selectBox" ng-model="selectedRealm" name="selectedRealm" ng-options="realm.name for realm in realmList">
<option value="" class="realmPlaceholder" disabled selected>Select Realm Name</option>
</select>
<button type="button" ng-click="buttonpress(charName, selectedRealm)" class="searchButton">Search</button>
</div>
</div>控制器代码：
$scope.buttonpress = function(charName, realmName){
if(typeof charName === "undefined" || charName.includes("world") || typeof realmName === "undefined"){
alert("Please enter a valid Character Name and Realm.")
} else {
var request = {name: charName, realm: realmName};
$http.post('/buttonpress', request)
.then(function(response) {
alert(response.data);
});
}
}CSS：
input.searchButton {
text-align: center;
width: 79%;
background-color: #128880;
color:#ACC8C9;
border: none;
margin-top: 5px;
height: 22%;
}
input.searchButton:hover {
background-color: rgb(1, 92, 196)
}
input.searchButton:active {
background-color: #134b58;
box-shadow: 0 5px rgb(102, 102, 102);
transform: translateY(4px);
}注意:我注意到这也只是在启动页面和刷新时才会出现。
回答 1
Stack Overflow用户
发布于 2017-12-12 03:29:50
哇哦。这就是为什么在凌晨4:30之前编码不是一个好主意一些愚蠢的错误将会发生：
$scope.buttonpress = function() {
$scope.buttonpress = function(){
if(typeof $scope.charName === "undefined" || $scope.charName.includes(";") || typeof $scope.selectedRealm === "undefined"){
alert("Please enter a valid Character Name and Realm.")
} else {
var request = {name: $scope.charName, realm: $scope.selectedRealm};
$http.post('/buttonpress', request)
.then(function(response) {
// alert(response.data);
debugger;
$scope.showBoard = true;
});
}
}
};谜底:不知何故，我把buttonPress放在了另一个buttonPress里面..哇哦。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/47748167
复制相关文章
相似问题
按钮单击submit ajax form
C#按钮仅在第二次单击时触发
单击submit按钮时触发Ajax调用
应禁用Angular Form Submit，但单击时仍会显示错误
单击- onclick="this.form.submit()“按钮时表单不提交
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
社区富文本编辑器全新改版！诚邀体验～
全新交互，全新视觉，新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能，全面提升创作效率和体验
腾讯云开发者
