programing

AngularJS: 양식의 모든 양식 컨트롤을 비활성화하는 방법?

mailnote 2023. 11. 7. 21:03
반응형

AngularJS: 양식의 모든 양식 컨트롤을 비활성화하는 방법?

보기 버튼 클릭 시 편집할 수 없도록 양식 구성요소를 모두 비활성화하고 싶습니다.이것은 나의 폼입니다.

<form action="#" class="form-horizontal" >
   <div class="form-group">
      <label for="fieldname" class="col-md-3 control-label">Name</label>
      <div class="col-md-6">
         <input type="text" ng-model="newItem.customSelected" typeahead="name as name.name for name in members | filter:{name:$viewValue}" class="form-control" />
      </div>
   </div>
   <div class="form-group">
      <label for="fieldhname" class="col-md-3 control-label">House name</label>
      <div class="col-md-6">
         <input type="text" ng-model="newItem.customSelected1" typeahead="house_name as house_name.house_name for house_name in family | filter:{house_name:$viewValue}" class="form-control" />
      </div>
   </div>
   <div class="form-group">
      <label for="" class="col-md-3 control-label"><?php echo $this->lang->line('label_family_id'); ?></label>
      <div class="col-md-6">
         <input type="text" ng-model="newItem.customSelected2" typeahead="fm as fm.family_reg_no for fm in family | filter:{family_reg_no:$viewValue}" class="form-control" />
      </div>
   </div>
   <div class="col-md-3"></div>

</form>

그리고 이건 내 버튼입니다

<input type="button" class="finish btn-success btn" ng-click="view(newItem)" value="view"/>

필드 단위로 처리하는 대신 모든 폼 요소를 필드 집합에 넣고 ng-disabled를 사용하여 전체 필드 집합을 비활성화할 수 있습니다.

사용가능fieldset당신의 단추를 a로 둘러싸서 태그를 지정합니다.fieldset사용하는 것.ng-disabled특성:

<form action="#" class="form-horizontal" >
   <fieldset ng-disabled="isClicked">
      <!--your form here --!>
   </fieldset>
</form>

이제 남은 것은 그 안에 있습니다.view(newItem)함수 do:

$scope.view = function(newItem){
   $scope.isClicked = true;
   // Your code here and set it to false when your are done with it
}

오버레이를 사용하여 ang-show를 표시하거나 각 입력 ng-disabled에 추가할 수 있습니다.

  1. 보기 버튼을 클릭할 때 범위 변수를 설정합니다.
  2. 사용하다ng-disabled범위 변수와 함께 사용하여 필드를 비활성화합니다.

언급URL : https://stackoverflow.com/questions/21430644/angularjshow-to-disable-all-the-form-controls-in-a-form

반응형