각형 제출 버튼은 두 번째 클릭시에만 실행됩니다.

Question

API에 대한 쿼리를 수행하는 작은 웹 페이지를 만들고 있습니다. 입력 된 모든 데이터가 유효하면 제출 단추를 누르면 조회가 발생합니다. 그러나 어떤 시점에서 별도의 요소 집합 (텍스트 상자, 선택 상자, 단추)에서 양식을 조정할 때 "검색"을 한 번 클릭 한 다음 다시 실행하여 해당 기능이 실행되도록했습니다.

진행 상황/문제를 해결하려면 어떻게해야합니까?

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); 
} 

참고 :이 페이지 만 상쾌한을 시작하기에도 나타났습니다.

Answer 1

와우. 이것이 오전 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을 넣어 .. 으악.