Javascript not being called when event fires (Only with $(document).ready)

Question

I have a JS code in my WebApp and it's supposed to be triggered when I click a anchor and in fact it is, but only if I also use with $(document).ready. If I use only the click event the script is not executed, but if I insert one more line in the JS file with $(document).ready the script is invoked as soon as the page load and also when I click the button. My intention in to call that script only when this particular button is clicked but I can't find a way to achieve this. Can you guys help?

<c:forEach items="${prontuario.atendimentos}" var="atendimento">
  <li> ${atendimento.preenchimentoModeloAtendimento} ${atendimento.dataAtendimento} ${atendimento.tipoDeAtendimento.custo}
   <a href="<c:url value="/prontuario/removerAtendimentoDoProntuario/${prontuario.prontuarioId}/${atendimento.atendimentoId}"></c:url>"><i class="fa fa-arrow-circle-o-down fa-2x"></i></a>
    <a id="aEditaAtendimento" href="<c:url value="/prontuario/editarAtendimento/${prontuario.prontuarioId}/${atendimento.atendimentoId}"></c:url>"><i class="fa fa-arrow-circle-o-down fa-2x"></i></a>
  </li>
</c:forEach>

var abreEdicaoAtendimento = function() {
  var idAtendimento = $('#idAtendimento').text();
  var botaoAbreModal = $('#btnEditarAtendimento');
  var campoIdPersistir = $('#atendimentoId');
  alert(idAtendimento);
  if (idAtendimento !== null) {
    campoIdPersistir.val(idAtendimento);
    botaoAbreModal.click();
  } else {
    alert('else');
  }
};
$('#aEditaAtendimento').click(abreEdicaoAtendimento);
$(document).ready(abreEdicaoAtendimento);

You are binding on an id, that is being duplicated in a for loop. Also by not binding inside the document ready, the markup that you are trying to target should already be parsed and in the dom, meaning you need to have this script after the markup on the page. — Taplar, May 07 '18 at 17:21
You need to put the call to `.click()` inside the `document.ready`. — Barmar, May 07 '18 at 17:44
I'm using JSP Tags here and I made sure that my script is called after the page load by putting them right before the body closing. @Phiter — Renan Rodrigues, May 07 '18 at 17:49
@Barmar, I also tried to put the event trigger inside the ready event but this approach did not solved the issue — Renan Rodrigues, May 07 '18 at 17:52
@Taplar, I realized it's a mistake to create a element with a Id inside a for loop and I'm checking the best approach to achieve my goal without doing this. — Renan Rodrigues, May 07 '18 at 17:54
Since you're clicking on an anchor, you also need to use `event.preventDefault()` to prevent following the link. — Barmar, May 07 '18 at 17:56

Javascript not being called when event fires (Only with $(document).ready)

0 Answers0