How to trigger ngClick programmatically

Question

I want to trigger ng-click of an element at runtime like    ele click      OR   ele trigger  click   function       How can this be done

User · Answer

Simple sample   HTML   lt div id  player  gt       lt div id  my-button  ng-click  someFuntion    gt Someone lt  div gt   lt  div gt    JavaScript   timeout function         angular element   my-button   triggerHandler  click       0     What this does is look for the button s id and perform a click action  Voila   Source  https   techiedan com angularjs-how-to-trigger-click

User · Answer

The syntax is the following   function clickOnUpload        timeout function         angular element   myselector   triggerHandler  click                 Using Angular Extend angular extend  scope      clickOnUpload  clickOnUpload         OR Using scope directly  scope clickOnUpload   clickOnUpload    More info on Angular Extend way here   If you are using old versions of angular  you should use trigger instead of triggerHandler   If you need to apply stop propagation you can use this method as follows    lt a id  myselector  ng-click  clickOnUpload     event stopPropagation     gt    Something  lt  a gt

User · Answer

Just in case everybody see s it  I added additional duplicating answer with an important line which will not break event propagation   scope clickOnUpload   function   event             event stopPropagation        lt -- this is important       timeout function             angular element domElement  trigger  click           0

User · Answer

The best solution is to use   domElement click     Because the angularjs triggerHandler angular element domElement  triggerHandler  click    click events does not bubble up in the DOM hierarchy  but the one above does - just like a normal mouse click   https   docs angularjs org api ng function angular element  http   api jquery com triggerhandler   https   developer mozilla org en-US docs Web API HTMLElement click

User · Answer

Using plain old JavaScript worked for me  document querySelector   elementName   click

User · Answer

angular element domElement  triggerHandler  click      EDIT  It appears that you have to break out of the current  apply   cycle  One way to do this is using  timeout      timeout function         angular element domElement  triggerHandler  click       0     See fiddle  http   jsfiddle net t34z7

User · Answer

Include following line in your method there you want to trigger click event  angular element   btn you want to click progmaticallt   triggerHandler  click

User · Answer

This code will not work  throw an error when clicked     timeout function        angular element   btn2   triggerHandler  click          You need to use the querySelector as follows    timeout function        angular element document querySelector   btn2    triggerHandler  click

User · Answer

This following solution works for me     angular element document querySelector   myselector    click      instead of    angular element   myselector   triggerHandler  click

User · Answer

You can do like   timeout function        angular element   btn2   triggerHandler  click

[javascript] How to trigger ngClick programmatically

Examples related to javascript

Examples related to jquery

Examples related to angularjs

Examples related to angularjs-ng-click