Refer to element by using $(this) in ajax

Question

I want to use the $(this)-selector in the ajax success function to select the element .selectclass which was doubleclicked before. However, this doesn't work. Is it possible to select in the ajax success function?

jQuery:

$(document.body).on("dblclick",".selectclass",function(){
    bla = $(this).attr("class").slice(5); //works fine
    $.ajax({
        url: 'bla.php',
        type: 'post',
        dataType:'json',
        data: {
            'bla':bla
        },
        success: function(reply) {
            if((reply == "blabla")
            {
                $(this).siblings().find(".likes, .likes1").slideToggle('slow'); //not working 
            }
        }
    });
});

Praveen Kumar Purushothaman · Accepted Answer · 2016-12-23T01:07:54.857

3

You need to cache the variable.

$(document.body).on("dblclick", ".selectclass", function() {
  var $this = $(this);
  var bla = $this.attr("class").slice(5); //works fine
  $.ajax({
    url: 'bla.php',
    type: 'post',
    dataType: 'json',
    data: {
      'bla': bla
    },
    success: function(reply) {
      if (reply == "blabla") {
        $this.siblings().find(".likes, .likes1").slideToggle('slow'); // will work now 
      }
    }
  });
});

Please use var for local variables. Also you have a typo after if.

if((reply == "blabla") // Remove the double parenthesis.

edited Dec 23 '16 at 01:07

answered Dec 23 '16 at 01:04

Praveen Kumar Purushothaman

164,888
24
203
252

2

You might as well cache it before you use it but +1 – Wesley Smith Dec 23 '16 at 01:05
1

@DelightedD0D That line is a test line by OP right, so I ignored it. Right? `:)` – Praveen Kumar Purushothaman Dec 23 '16 at 01:06
2

Use `var` please! – Lightness Races in Orbit Dec 23 '16 at 01:07
Lol, yup, indeed, my bad, just saw the two `$(this)` next to each other and it looked odd. – Wesley Smith Dec 23 '16 at 01:07
@LightnessRacesinOrbit Updated. I don't see why not use the global scope. Anyways. – Praveen Kumar Purushothaman Dec 23 '16 at 01:08
1

@LightnessRacesinOrbit maybe Praveen writes as much php as I do, I catch myself doing that all the time! – Wesley Smith Dec 23 '16 at 01:08
1

_"I don't see why not use the global scope"_ :( – Lightness Races in Orbit Dec 23 '16 at 01:09
1

@LightnessRacesinOrbit Sorry `:(` – Praveen Kumar Purushothaman Dec 23 '16 at 01:09
1

Thank you soo much! Sat quite a while working on this and didn't find anything on the internet either... :) will accept your answer asap – Moritz Dec 23 '16 at 01:13
@Moritz You are welcome... `:)` Waiting for 5 mins... `:D` – Praveen Kumar Purushothaman Dec 23 '16 at 01:13
2

@Moritz just to mention it, in case it isnt clear *why*, ["Inside the callback, this refers to the jqXHR object of the Ajax call, not the element the event handler was bound to"](http://stackoverflow.com/a/6394826/1376624) – Wesley Smith Dec 23 '16 at 01:17
1

@Moritz See the above link by D0D as well. Looks interesting... `:)` – Praveen Kumar Purushothaman Dec 23 '16 at 01:18
1

Can also use the `context` option for `$.ajax` ... `context:this` – charlietfl Dec 23 '16 at 02:44
@charlietfl Yea, that's what the above comment says... `:D` – Praveen Kumar Purushothaman Dec 23 '16 at 02:49

Refer to element by using $(this) in ajax

1 Answers1