How to call click method without clicking button in javascript?

Question

I have a dynamic data to display in front end.I have 'see more' and 'see less' option to each data.When Clicking the 'see more' option need to call some api. So I need to avoid 'see more' click. if i have five records and calling see more option using javascript element click() method in angular. this is not working for html collection.

setTimeout(() => {
  let getSeeMoreEle = document.getElementsByClassName('see-more');
  for (let index = 0; index < getSeeMoreEle.length; index++) {
     getSeeMoreEle[index].click();
  }
}, 500);

Why you need to click see more without calling your API and why your are calling an API in onClick? — Farzaneh Torkpichlou, Jan 27 '20 at 09:41
Once rendered the data in front end i need to call see more method programmatically.@NicholasK — Manikandan, Jan 27 '20 at 09:48
You can call your additional method in the resolve() method or then() method of your async API call or use viewChildren for loop if you want to change the element in the component html file. — Farzaneh Torkpichlou, Jan 27 '20 at 10:14
@Manikandan Did you attach onClickListener on `see-more` node or to its child nodes? If it's attached to its child node then it won't work due to bubbling. — Abhishek, Jan 27 '20 at 10:18

score 0 · Answer 1 · answered Jan 27 '20 at 10:20

      let getSeeMoreLength = document.getElementsByClassName('see-more');

      for (let index = 0; index < getSeeMoreLength.length; index++) {
             let getSeeMoreEle:HTMLElement = document.getElementsByClassName('see-more')[index] as HTMLElement;
            getSeeMoreEle.click();
       }

this code worked.

score -3 · Answer 2 · answered Jan 27 '20 at 09:57

-3

You can use jQuery or simple JS methods to do that. In this question, you can use this method to do that out from browser console. But you can equally apply that from the code.

$('#button1').click();
document.getElementById('button1').click();

answered Jan 27 '20 at 09:57

Evgenii Klepilin

695
1
8
21

How to call click using document.getElementByClassName('see-more'); – Manikandan Jan 27 '20 at 10:02

How to call click method without clicking button in javascript?

2 Answers2