CODEWITHSUNDEEP
javascriptjqueryionic-frameworkionic-view
smchae
smchae

Reputation: 1095

Ionic trigger click event does not work

I have a modal in my Ionic app and when modal is shown, I want to trigger click event on specific element.

Controller
$scope.$on('modal.shown', function() {
      document.getElementById('somemodal').click(); // #1
      $( "#somemodal" ).triggerHandler( "click" );  // #2
});


Index.html
<h1 class="title" id="somemodal" ng-click="start()">info</h1>

Both #1 and #2 do not trigger ng-click which triggers function start in another controller.

Any suggestion or advice would be appreciated.

Thank you.

Upvotes: 3

Views: 707

Answers (4)

Rajesh
Rajesh

Reputation: 662

You can use ionic model

$ionicModal.fromTemplateUrl('yourmodelhtml.html', {
      scope: $scope
    }).then(function(modal) {
      $scope.confirm = modal;
    });

then call this $scope.confirm to open up on click event.

Upvotes: 0

smchae
smchae

Reputation: 1095

I was able to do this by doing below.

Controller
$scope.$on('modal.shown', function() {
      $rootScope.start();
});

Another Controller
$rootScope.start= function () {
      some code ...
}

Upvotes: 1

JanP
JanP

Reputation: 1581

If both controllers are on the same level, use a factory like:

(function() {
    'use strict';

    angular
        .module('yourapp')
        .factory('yourfactory', yourfactory);

    yourfactory.$inject = [$rootScope];

    /* @ngInject */
    function yourfactory($rootScope) {
        var service = {
            start: start
        };
        return service;

        function start() {
            $rootScope.$broadcast('dostart', {});
        }
     }
})();

Then in Controller 1 (with the modal):

$scope.$on('modal.shown', function() {
      yourfactory.start(); // Don't forget to inject yourfactory
});

And in Controller 2:

$scope.$on('dostart', function(event, args) {
    $scope.start();
});

If both controllers are not on the same level, it is also possible to do a direct $broadcast or $emit from your first controller without a factory, depending on the hierarchy of your controllers

Upvotes: 1

Rai Vu
Rai Vu

Reputation: 1635

You should try this :

<label class="item">
    <div class="button button-block button-positive" ng-click="start()">info</div>
</label>

In your controller :

$scope.start = function() 
{

}

Upvotes: 0

Related Questions