jeudi 10 septembre 2020

How to show and hide paragraph when checkbox checked

I'm new to AngularJS. I need to show <p> when checkbox is checked = true. Currently <p> is showing when mouse hover-over. instead of that I need to show <p> when sendSMS is checked = true my code as follows,

<div class="col-xs-12">
<div class="form-group label-floating" ng-class="{'is-empty': vm.checkInData.telephone === null}">
  <label for="phone" class="control-label">xxx-xxx-xxxx</label>
  <input type="text" class="form-control" ng-model="vm.checkInData.telephone" id="phone"
         ng-pattern="/^[(]?[0-9]{3}[)]?[-\s\.]?[0-9]{3}[-\s\.]?[0-9]{4}$/" name="phone" required>
  <div ng-messages="vm.inputForm.phone.$error" ng-show="vm.formSubmitted || vm.inputForm.phone.$touched">
    <div class="ngMessage" ng-message="required">Phone number is required.</div>
    <div class="ngMessage" ng-message="pattern">Phone number should be a valid 10 digit one.</div>
  </div>
  <div class="form-group">
    <div class="checkbox">
      <label>
        <input type="checkbox" ng-model="vm.checkInData.sendSMS"> Receive text updates
      </label>
    </div>
    <p class="help-block">Message &amp data rates may apply.</p>
  </div>
</div>
</div>

How can I do that.




Aucun commentaire:

Enregistrer un commentaire