J'ai des entrées radio et je veux vérifier l'état en cliquant sur radio si la radio actuelle est cochée.
Ce code:
<input type="radio" id="average_0" name="average" ng-model="checked" ng-change="false" value="500" class="ng-valid ng-dirty">
<input type="radio" id="average_1" name="average" ng-model="checked" ng-change="false" value="1000" class="ng-valid ng-dirty">
<input type="radio" id="average_2" name="average" ng-model="checked" ng-change="false" value="1500" class="ng-valid ng-dirty">
Ne fonctionne pas.
Les boutons radio ne peuvent être sélectionnés que l'un après l'autre et ne peuvent pas être désélectionnés par l'utilisateur une fois qu'ils ont été cochés (sauf si vous le faites par programme). Donc, si vous voulez le décocher quand il est sélectionné, vous pouvez faire ceci:
<input type="radio" ng-model="checked" value="500" ng-click="uncheck($event)" />
<input type="radio" ng-model="checked" value="1000" ng-click="uncheck($event)" />
<input type="radio" ng-model="checked" value="1500" ng-click="uncheck($event)" />
Dans votre contrôleur:
$scope.uncheck = function (event) {
if ($scope.checked == event.target.value)
$scope.checked = false
}
DEMO: http://jsfiddle.net/8s4m2e5e/3/
NOTE: Si vous voulez vraiment choisir une option parmi d’autres, vous pouvez opter pour un <select>
.
Une solution simple qui fonctionne sur Angular 1.3+ est la suivante:
Modèle
<input type="radio" ng-model="forms.selected" value="{{value}}" ng-click="radioCheckUncheck($event)">
Manette
let lastChecked = null
$scope.radioCheckUncheck = function (event) {
if (event.target.value === lastChecked) {
delete $scope.forms.selected
lastChecked = null
} else {
lastChecked = event.target.value
}
}
Elle ressemble à la solution ci-dessus, mais conserve sa propre copie de la sélection précédente.
Une solution plus simple consiste à ajouter:
ng-dblclick = "checked = null"
J'ai résolu le problème avec le code suivant:
ng-dblclick = "{{model}} = '' "