CODEWITHSUNDEEP
javascriptajaxvariables
Ryan Palmer
Ryan Palmer

Reputation: 543

Set a variable to the data element

Setting up a Flickr script... In my ajax success function, how would I put a var in with the actual this element? I know this and $(this) represent different things. Hard to write out, so I'll use my code examples to explain better.

I have my function set with the defined variables: function flickr_feed(flickrID, flickr_count, photo_size) {, which the variable in question is the photo_size

Using a condition to set the getSize variable from the readable format in photo_size:

if (photo_size == 'square') var getSize = 'url_sq';

I then dump that getSize into the ajax url:

url: 'http://api.flickr.com/services/rest/?&method=flickr.people.getPublicPhotos&api_key=' + flickrAPI + '&user_id=' + flickrID + '&per_page=' + flickr_count + '&page=0&extras=' + getSize + '&format=json&jsoncallback=?',

The problem I'm having in the success function is setting that getSize var to the element.

success: function(data) {
    $.each(data.photos.photo, function() {
        var photoID = 'http://www.flickr.com/photos/' + flickrID + '/' + this.id;
        var photoSrc = this.getSize;
        console.log(photoSrc);
    });
}

In this result, photoSrc returns undefined. But if I manually set photoSrc to this.url_sq, it's fine. Just can't figure out how to get the variable in there to work the same way.

Apologies for the horrible explanation. If it makes sense at all, any help would be greatly appreciated.

EDIT: My experience with $.ajax is limited. But from what I gather, this refers to the returned data. So in that sense, the photoSrc returns undefined as it is thinking getSize is a result within the data, which it isn't. So how would that be written so that it would use the actual getSize value?

EDIT: Here's a pastebin of the script: http://pastebin.com/KGCUgAet

Upvotes: 0

Views: 89

Answers (2)

Ryan Palmer
Ryan Palmer

Reputation: 543

Sorted it out with writing the photoSrc var like this: var photoSrc = this[getSize];

Thanks Sushanth for confirming my question about this and the returned data. That helped figure it out.

Upvotes: 0

Sushanth --
Sushanth --

Reputation: 55740

Cache your this before your ajaxRequest

var originalContext = this;
$.ajax({


success: function() {
     $.each(data.photos.photo, function() {

          originalContext // Available here
          this  // Current object under iteration
     });
}

Upvotes: 1

Related Questions