从下拉列表更改内容后,停用按钮

时间:2016-06-30 18:04:59

标签: javascript html angularjs angularjs-ng-change jsonselect

保存按钮仅在从下拉列表中选择指令文本时才有效。 问题是,如果我对选定的指令文本进行了更改,则该按钮仍处于活动状态。 我尝试用ng-change替换on-select但是没有解决问题。 如果对输入指令文本进行任何更改,如何取消激活按钮?

控制器

$scope.validInstructionText = true;

$scope.checkInstructionText = function(instruction, $index) {
  $http.get("/api/instructions?searchInstructionText=" + instruction).then(function(response) {
    if (instruction === response.data[0].instructionText) {
      return $scope.validInstructionText = false;
    } else {
      return $scope.validInstructionText = true;
    }
  });
};

HTML

<div class="row" ng-init="initUpsert()">
  <div class="input-field col m4">
    <label class="active" for="instructionText">Instruction Text</label>
    <autocomplete
      ng-if="!currentQuestion.id || currentQuestion.status === 'flagged'"
      ng-model="currentQuestion.Instruction.instructionText"
      data="instructionChoices"
      attr-placeholder="Instruction Text"
      attr-input-class="validate"
      attr=id="instructionText"
      on-type="getRemoteInstructions"
      on-select="checkInstructionText"
      autocomplete-required="true"></autocomplete>
    <input ng-if="currentQuestion.id && currentQuestion.status !== 'flagged'" type="text" ng-model="currentQuestion.Instruction.instructionText" ng-disabled="true">
  </div>
  <div class="row">
    <div class="col m12 right-align">
      <button class="modal-action waves-effect btn waves-green teal white-text btn-flat" ng-click="spellcheck(true)" ng-show="currentQuestion.status === 'review' && isModified === true" ng-disabled="validInstructionText">
      Save and Add Another
      </button>
      <button class="modal-action waves-effect btn waves-green teal white-text btn-flat" ng-click="spellcheck(flase)" ng-show="currentQuestion.status === 'review' && isModified === true" ng-disabled="validInstructionText">
       Save
      </button>
    </div>
  </div>
  <ng-include src="'/views/modals/spellCheckModal.html'"></ng-include>
</div>

0 个答案:

没有答案