javascript - Angularjs Multidimensional array and two relative select boxes -
i have multidimensional array holds product names , versions. want create interface lets user select product select box, , version number in second select box. second select box should show versions numbers of product user selected in first select box.
this mutidimensional array:
[object]0: name: "product 1" versions: [array]0: number: "1.0" number: "1.5.2" 1: name: "product 2" versions: [array]0: number: "0.0" number: "0.5"
the user has option choose multiple products, created array hold users selection.
my controller setup this:
app.controller('maincontroller', function ($scope) { $scope.products = [{id: 1, name: '', versions: []}]; $scope.packages = []; $scope.packages[0] = { id: 1, name: 'product 1', versions: [{number: 1.0}, {number: 1.5}, {number: 2.0}]}; $scope.packages[1] = { id: 2, name: 'product 2', versions: [{number: 0.1}, {number: 0.2}, {number: 0.3}]}; $scope.addproduct = function(){ var id = $scope.products.length + 1; $scope.products.push({id: id, name: "", version: []}); }; });
and select boxes setup angularjs:
<div ng-repeat="product in products"> <label>product</label> <select ng-model="product.product" ng-options="package.name package in packages" class="form-control"></select> <label>version</label> <select ng-model="product.versions" ng-options="version.number version in product.versions" class="form-control"></select> </div> <button ng-click="addproduct()">add product</button>
what tried setup ng-options select versions object of current product. doesn't work.
i created jsfiddle of have: http://jsfiddle.net/rkyu4rjq/
i appreciate suggestions on how link version select box product selected.
tia
eventhough i'm not keeping track of version chosen each product fixed relative select options.
you can find solution
here. should on way!
Comments
Post a Comment