Dan
Dan

Reputation: 57

Object values not persisting

http://plnkr.co/edit/KEhcaEs2GptBlF60KAXi?p=preview

I'm trying to create an accordion with multiple options in each group. Once a selection is made in a group the group below it is enabled and expanded to allow for the next selection. I got the UI to work, but when I store the selection it gets overridden every time I select something.

How can I persist the selected values?

angular.module('ui.bootstrap.demo', ['ui.bootstrap']);
angular.module('ui.bootstrap.demo').controller('AccordionDemoCtrl', function ($scope) {

    $scope. oneAtATime = true;

    $scope.selectedCar = {
        make: null,
        model: null,
        year: null,
        comments: null
    }

    $scope.setSelectedCar = function (key, value) {
        $scope.selectedCar[key] = value;
    }

    $scope.status = {
        isFirstOpen: true,
        isFirstDisabled: false
    };

    $scope.cars = {};
  });

Upvotes: 1

Views: 126

Answers (1)

Daniel
Daniel

Reputation: 6491

The reason your values do not persist is because they are being overriden:

<accordion-group heading="Model" is-open="selectedCar.make" is-disabled="!selectedCar.make">

The attribute is-open="selectedCar.make" will actually set selectedCar.make to false once the accordion is closed.

Same goes for all other values.

Here's a working plunker. (also containing fixes to a few other problems like inappropriate data-binding for selectedCar and stuff...)

Upvotes: 3

Related Questions