returning data from angularjs modal dialog service

[Peter]

I am fairly new to AngularJS and having a problem with returning data from a modal dialog service. Basically, I copied Dan Wahlin's service http://weblogs.asp.net/dwahlin/archive/2013/09/18/building-an-angularjs-modal-service.aspx and am calling it from my controller.

myApp.controller('MyController', function($scope, ModalService) {
    window.scope = $scope;
    $scope.mydata = {name: ""};

    $scope.showModal = function () {

        var modalOptions    = {
            closeButtonText: 'Cancel',
            actionButtonText: 'Save',
            headerText: 'Save Dialog'
        }

        ModalService.showModal({}, modalOptions).then(function (result) {

        });
    }

});

Then I have my partial like so:

<div class="modal-header">
    <h3>{{modalOptions.headerText}}</h3>
</div>
<form ng-submit="modalOptions.submit()">
<div class="modal-body">
    <label>Name</label>
    <input type="text" data-ng-model="mydata.name">
</div>
<div class="modal-footer">
    <button type="button" class="btn" data-ng-click="modalOptions.close()">{{modalOptions.closeButtonText}}</button>
    <button type="submit" class="btn btn-primary">{{modalOptions.actionButtonText}}</button>
</div>

This modal is being invoked like this:

<button class="btn btn-primary hidden pull-right" id="save" data-ng-click="showModal()">Save</button>

So my question is how do I get the value of the name field back to the controller? I've looked all over the web and all the examples have the function that opens the modal reside inside the controller, which makes it much easier as $scope from the controller also exists in the function that opens the modal.

I tried adding the following code to the 'show' function in the service but it did not work.

    tempModalDefaults.resolve = function($scope) {
        mydata = function () {
            return $scope.mydata;
        }
    }

Thanks

P.S. I renamed modalService to ModalService in my code, so that's not a typo. The modal opens and closes as it should, I just can't pass the field's value back to the controller.

[Mark Volkmann]

I created a directive similar to this recently. Mine uses isolate scope. I can supply several options including btnMap and resultObj. btnMap is just a JS object where the keys are the text for the buttons to display in the footers and the values are functions to be executed when the corresponding button is pressed. Those functions can put data on resultObj, so that's a way to get data out of the modal.

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.

--
R. Mark Volkmann
Object Computing, Inc.

[johntom]

The following from a lightning demo dec 2013 is an alternate way.

http://plnkr.co/edit/cvrFCo?p=preview
John