AngularJS passing data back from modal

Question

I'd appreciate some help here... I am looking at making use of AngularJS for a few projects I have in mind. Currently experimenting with the Bootstrap UI directive. Please take a look at my code here: http://pastebin.com/zJGpNLep

Is there a way I can update $scope.groups with the data from $scope.formData which is generated from a modal? I have tried $scope.groups.push($scope.formData) which has proved unsuccessful and only way I can see the new data is by refreshing the page.

Any ideas??

Thanks

thechrisman · Accepted Answer · 2014-01-26 01:13:55Z

7

You're on the right track, you just left out these lines:

modalInstance.result.then(function (formData) {
  //use formData
});

This should go at the end of your $scope.showAddGroupModal function as shown in the bootstrap-ui example here:

$scope.open = function () {

  var modalInstance = $modal.open({
    templateUrl: 'myModalContent.html',
    controller: ModalInstanceCtrl,
    resolve: {
      items: function () {
        return $scope.items;
      }
    }
  });

  modalInstance.result.then(function (selectedItem) {
    $scope.selected = selectedItem;
  }, function () {
    $log.info('Modal dismissed at: ' + new Date());
  });
};

answered Jan 26, 2014 at 1:13

thechrisman

3603 silver badges3 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Joel Skrepnek · Accepted Answer · 2014-01-26 01:13:24Z

1

You need to interact with the promise in the result property of the object that is returned from the call to open. That promise will be resolved when the modal is closed or rejected when the modal is dismissed. Any data that you pass to close or dismiss will be returned through the promise callbacks.

At a high level, it looks like this:

var modal = $modal.open({
   // modal setup
});

modal.result.then(function(group) {
    $scope.groups.push(group)
}, function () {
   // the modal was dismissed
});

Hope that helps.

answered Jan 26, 2014 at 1:13

Joel Skrepnek

1,6611 gold badge13 silver badges21 bronze badges

1 Comment

user1297396 Over a year ago

Awesome... This proved to be the right one for me...Many thanks! :)

Collectives™ on Stack Overflow

AngularJS passing data back from modal

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related