lundi 31 juillet 2017

Validate checkbox that which are required

I'd like to create terms and conditions form in my angularjs project.

From multiple checkboxes only several are required, and I'd like to enable submit button, only when all required checkboxes are checked.

Here is my checkboxes:

<label class="agreement-label control-label required">Zgoda</label>
<input class="agreements ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required" id="agreement_1" name="agreement" required="" ng-model="client.agreement[0]" type="checkbox">

<label class="agreement-label control-label">Zgoda 2</label>
<input class="agreements ng-pristine ng-untouched ng-valid ng-not-empty" id="agreement_2" name="agreement" ng-model="client.agreement[1]" type="checkbox">

<label class="agreement-label control-label">Zgoda 4</label>
<input class="agreements ng-pristine ng-untouched ng-valid ng-not-empty" id="agreement_5" name="agreement" ng-model="client.agreement[4]" type="checkbox">

<label class="agreement-label control-label required">Zgoda 5</label>
<input class="agreements ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required" id="agreement_6" name="agreement" required="" ng-model="client.agreement[5]" type="checkbox">

<button class="btn btn-success" id="ticketFormSubmit" ng-disabled="isAgreementsInvalid()" ng-click="changeButtonValue()" type="submit" disabled="disabled">Zapisz</button>

And in my angular controller:

$scope.isAgreementsInvalid = function() {
    return $scope.ticketForm.agreement.$invalid;
}

The problem is, only last required checkbox is validating.




Aucun commentaire:

Enregistrer un commentaire