AngularJS에서 확인란이 선택되지 않은 경우 제출 버튼을 클릭 한 후 확인란에 대한 오류 메시지를 어떻게 표시 할 수 있습니까?
나는 이것을 시도했다 :
<form action="/" method="post" name="myForm" novalidate>
<label>
<input type="checkbox" name="myCheckbox" ng-model="myCheckbox" value="1" required>
</label>
<p class="error" ng-show="myForm.$submitted && myForm.myCheckbox.$error.required">Error message</p>
<button type="submit" ng-disabled="myForm.$invalid">Submit</button>
</form>
하지만 작동하지 않았습니다. 제출 버튼을 클릭해도 아무 일도 일어나지 않습니다. 양식 태그에서 "novalidate"를 제거하거나 제출 버튼에서 "ng-disabled"를 제거하면 확인란을 선택하지 않아도 양식이 제출됩니다.
도와 줄수있으세요 ?
당신은이 ng-disabled="myForm.$invalid"(가) (양식이 무효 인 경우에 버튼이 비활성화되어 있기 때문) 발사되고, 따라서 조건이 결코 이벤트를 제출하지 않도록, 당신의 제출 버튼에 ng-show="myForm.$submitted && myForm.myCheckbox.$error.required"있기 때문에 충족되지 않을 myForm.$submittedfalse입니다.
편집하다:
여기에있는 다른 사용자들이 제안했듯이, 현재 작업 방식을 변경하는 것이 최선의 방법이라고 생각합니다. 견인 솔루션 (매우 유사)에서 생각할 수 있지만 "각도" 요청을 보내는 것도 포함됩니다.
다음과 같은 각도로 양식 제출을 처리하십시오.
다음과 같이 양식에 입력하십시오 ( action="/" method="post"부품을 삭제했습니다 .
<form ng-submit="onSubmit(myForm)" name="myForm" novalidate>
ng-disabled="myForm.$invalid"제출 버튼에서 제거하십시오 . 그럼 이렇게 될거야<button type="submit">Submit</button>
... 그리고 컨트롤러에서
$scope.onSubmit = function(form){
if(form.$invalid){
//... do your call to backend here as you like since the call directly from the form was removed
}
}
또한 다음과 같이 양식을 변경하십시오. <form name="myForm" novalidate>
... 다음과 같이 제출 버튼을 변경하십시오. <button type="submit" ng-click="onSubmit(myForm)">Submit</button>
... 컨트롤러에 선언 된 동일한 함수를 사용합니다.
$scope.onSubmit = function(form){
if(form.$invalid){
//... do your call to backend here as you like since the call directly from the form was removed
}
}
그렇지 않으면 이렇게 상태를 바꿔야합니다
ng-show="myForm.myCheckbox.$error.required"
그러나 이것은 양식이 제출되기 전에 메시지를 표시합니다
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다