Cancel Event Click JQuery preventDefault

Question

Cancel Event Click JQuery preventDefault

Navigation

#1 by (0 votes)

0

Hello, I'm not able to use addClass when I give a response to my page using ajax. What happens is that it adds the class to my html element for a moment, but the behavior is as if the page was loading, so nothing happens. I'm doing a paging.

$('.waves-effect a').click(function(e) {
  e.preventDefault();
  var url = $(this).data('href');

  $.ajax({
    type: "GET",
    url: url,
    success: function(response) {
      $('#form').html(response)
    },

    complete: function() {
      $(".waves-effect").click(function() {
        $(this).addClass("active");
      });
    }
  });
});

  <li class="waves-effect"><a data-href="webmail.php?page=<?=$i?>"><?=$i?></a></li>

I'm a bit of a layman in JQuery, thanks for everyone's help.

html jquery ajax

asked by anonymous 05.01.2018 / 12:30

1 answer

Problems inserting image into a Button How to return only unmatched records in a JOIN? [duplicate]

score 0 · Answer 1

Try this:

<!-- NO HTML adicione o href="#" -->
<li class="waves-effect"><a href="#" data-href="webmail.php?page=<?=$i?>"><?=$i?></a></li>

<!-- NO JAVASCRIPT -->
$('.waves-effect a').click(function(e) {
  e.preventDefault();
  var element = $(this)
  var url = element.data('href');

  $.ajax({
    type: "GET",
    url: url,
    success: function(response) {
      $('#form').html(response)
    },

    complete: function() {
      $('.waves-effect a').removeClass('active')
      element.addClass("active");
    }
  });
});

Test yourself: link