How to retrieve a specific object with Parse.Query

Question

I am using Parse to create a WebApp and I am trying to get an instance of an object Productwith this code:

getProduct: function() {
   var productClass = Parse.Object.extend("Product");
   var query = new Parse.Query(productClass);
   var result = query.get(productId, {
       success: function(object) {
          console.log(object.get("productName"));
       },
       error: function(object, error) {
           ...
       }
   });
   return result;
}

I get a:

result.get is not a function

Printing the object only, I realized that I do not get a Product, I get this in the console (Safari):

[Log] Object (views.js, line 269)
_rejected: false
_rejectedCallbacks: Array[0]
_resolved: true
_resolvedCallbacks: Array[0]
_result: Arguments[1]
__proto__: Object

I tried many ways, but I am not able to retrieve a Product object and its attributes. What am I doing wrong?

EDIT

I am adding my Products View:

window.app.Products = Parse.View.extend({

    template: _.template($('#products-template').html()),

    el: $('body'),
    content: $('#content'),

    ...

    initialize: function() {
        _.bindAll(this, 'render');
        this.render();
    },

    render: function () {
        $(this.content).html(this.template);
        return this;
    },

    ...

    getUser: function() {
        return Parse.User.current();
    },

    getUserProduct: function() {
        var promise = new Parse.Promise();

        var productClass = Parse.Object.extend("Product");
        var query = new Parse.Query(productClass);
        query.equalTo("objectId", this.getUser().get("product").id);
        query.first().then(function(result) {
            if(result){
                // If result was defined, the object with this objectID was found
                promise.resolve(result);
            } else {
                console.log("Product was not found");
                promise.resolve(null);
            }
        }, function(error){
            console.error("Error searching for Product. Error: " + error);
            promise.error(error);
        });

        return promise;
    },

    setProduct: function() {
        this.getUserProduct().then(function(result) {
            if(result){
                console.log(result.get("productName"));
                var productName = result.get("productName");

            } else {
                console.log("Could not set Product"); 
            }
        }, function(error){
            console.log("Error: " + error);
        });
    }
});

I was trying by having a list of parameters and updating them like:

info: {
         user: '...',
         product: '...'
      }

Then passing it to the template:

$(this.content).html(this.template(this.info));

But I am not able to update product.

Answer 1

As I wrote this, I realised that you really aren't saving all that much code by pulling the product search into it's own method. My hope is that it will at least demonstrate to you how to create and call your own custom async methods. For example you may have a query which is much more complex than the current query, or it may perform multiple queries before finding the desired response, in which case it would make sense to pull it into it's own method.

Get Product Async Method

This method retrieves the Product with the given objectID

var getProduct =  function(productId) {
    var promise = new Parse.Promise();

    var Product = Parse.Object.extend("Product");
    var query = new Parse.Query(Product);
    query.equalTo("objectId",productId);
    query.first().then(function(result){
        if(result){
            // If result was defined, the object with this objectID was found
            promise.resolve(result);
        } else {
            console.log("Product ID: " + productId + " was not found");
            promise.resolve(null);
        }
    }, function(error){
            console.error("Error searching for Product with id: " + productId + " Error: " + error);
            promise.error(error);
    });

    return promise;
}

Calling Method

An example of a simple method which calls the above method.

var myMethod = function(){
    var productID = "12345678";

    getProduct(productID).then(function(result){
        if(result){
            console.log(result.get("productName"));
            var productName = result.get("productName");
            var productPrice = result.get("productPrice"); 
            // Now that you have some relevant information about your product
            // you could render it out to an Express template, or use this
            // value in a calculation etc. 
        } else {
            console.log("Product with objectId: " + productID + " was not found"); 
        }
    }, function(error){
        console.log("Error: " + error);
    });

}

Notes

• As these methods are asynchronous, there is no real data being returned in the 'return value' (the method returns a promise). Instead we return the relevant data as a result of the promise (where you see promise.resolve(XXX))
• It doesn't make any sense to have a mutable global variable in this Node.js style architecture.