Ich habe ein Formular und möchte zwei Auswahlfelder haben, damit in einem von ihnen bestimmte Optionen basierend auf dem aktuellen Wert eines anderen Auswahlfelds ein- / ausgeblendet werden.
z.B
Select box X Options :
A
B
Select box Y Options :
1 // shows only when A is selected in Select box X
2 // A
3 // A
4 // shows only when B is selected in Select box X
5 // B
6 // B
Hilfe bitte.
Der einfachste Weg, dies einzurichten, besteht darin, die sekundäre Sammlung einfach von der Auswahl der ersten abhängig zu machen. Sie können dies auf verschiedene Arten tun, aber es ist die beste Wahl, einfach die gebundene Sammlung auszutauschen.
Ein einfaches Beispiel:
(function() {
'use strict';
function InputController() {
var secondary = {
A: [1, 2, 3],
B: [3, 4, 5]
},
vm = this;
vm.primary = ['A', 'B'];
vm.selectedPrimary = vm.primary[0];
vm.onPrimaryChange = function() {
vm.secondary = secondary[vm.selectedPrimary];
};
}
angular.module('inputs', [])
.controller('InputCtrl', InputController);
}());<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js"></script>
<div class="container" ng-app="inputs" ng-controller="InputCtrl as ctrl">
<div class="row">
<div class="col-xs-6">
<h3>Primary</h3>
<select class="form-control" ng-model="ctrl.selectedPrimary" ng-options="item for item in ctrl.primary" ng-change="ctrl.onPrimaryChange()"></select>
</div>
<div class="col-xs-6">
<h3>Secondary</h3>
<select class="form-control" ng-model="ctrl.selectedSecondary" ng-options="item for item in ctrl.secondary"></select>
</div>
</div>
</div>Dieser Artikel stammt aus dem Internet. Bitte geben Sie beim Nachdruck die Quelle an.
Bei Verstößen wenden Sie sich bitte [email protected] Löschen.
Lass mich ein paar Worte sagen