0

Would like to execute parts of two controllers when I ng-click and my modal pops up

I have two controllers defined (datetimepicker.js to initialize/select a date of a new event and demo.js to save that date/event afterward).

See sample code below or see my plunker (When clicking the Add New Event button, my datetime stays empty because datetimepicker.js doesn't get executed to initialize the values)

I would like for the dates to be initialized according to datetimepicker.js (code below), but I'm not sure what would be the syntax to accomplish that.

index.html (the button)

button class="btn btn-primary pull-right" ng-click="vm.eventCreateClicked(vm.events)">Add new event</button>

datetimepicker.js (appears in modal and enables user to select date of event)

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

  $scope.today = function() {

    var dt1 = new Date();
    dt1.setHours( 9 );
    dt1.setDate( dt1.getDate() + 1 );
    dt1.setMinutes( 0 );
    $scope.dt1 = dt1;

    var dt2 = new Date();
    dt2.setHours( 10 );
    dt2.setDate( dt2.getDate() + 1 )
    dt2.setMinutes( 0 );
    $scope.dt2 = dt2;
  };
  $scope.today();

  *** more code here ***

demo.js (to save date/event selected above)

'use strict';

angular
  .module('demo', ['mwl.calendar', 'ui.bootstrap', 'ngTouch', 'ngAnimate'])
  .controller('MainCtrl', function ($modal, moment, $http) {

    var vm = this;

    vm.calendarView = 'month';
    vm.calendarDay = new Date();

/* 
******************************************
****  Show Create Event Modal
******************************************
*/
    vm.eventCreateClicked = function(event) {
         showCreateEventModal(vm.events);
    };

    function showCreateEventModal(events) {

      var modalInstance;

        modalInstance = $modal.open({
        templateUrl: 'modalCreateEventContent.html',
        controller: function() {
          var vm = this;

          vm.eventSaved = function() { 

               $http.put('/api/events/').success(function(eventsuccess){
               }).error(function(err){
               /* do something with errors */
               });

               //alert('Event Saved'); 
               modalInstance.close();
          };
        },
        controllerAs: 'vm'
      });
    }     

*** more code here ***
user3489502
  • 3,451
  • 9
  • 38
  • 66
  • Controllers don't call Controllers. Controllers depend on a Service. Controller-A calls Service, Controller-B calls Service. But if you must you may send Events between controllers. [Broadcast events](http://stackoverflow.com/questions/16199212/angularjs-broadcast-event-from-directive) – jmbmage Nov 03 '15 at 18:42
  • ok I see, any ideas about the syntax to get there? I need to get the code in datetimepicker.js (above) to get executed on function showCreateEventModal(events) (from demo.js) – user3489502 Nov 03 '15 at 19:09

0 Answers0