Sign up ×
Stack Overflow is a community of 4.7 million programmers, just like you, helping each other. Join them, it only takes a minute:

I've seen a number of similar questions posted but none of them have been able to get me closer to a solution.

I have data coming in to me like this from an ecommerce API: (keep in mind, I have NO control over how the data is being sent to me so I can't change anything at the "source.")

Object {
url: "http://pathtomyimage.jpg", name: ""}
name: ""url:  "http://pathtomyimage.jpg"

__proto__: Object__defineGetter__: __defineGetter__() { [native code] }__defineSetter__: __defineSetter__() { [native code] }__lookupGetter__: __lookupGetter__() { [native code] }__lookupSetter__: __lookupSetter__() { [native code] }constructor: Object() { [native code] }hasOwnProperty: hasOwnProperty() { [native code] }isPrototypeOf: isPrototypeOf() { [native code] }propertyIsEnumerable: propertyIsEnumerable() { [native code] }toLocaleString: toLocaleString() { [native code] }toString: toString() { [native code] }valueOf: valueOf() { [native code] }get __proto__: __proto__() { [native code] }set __proto__: __proto__() { [native code] }

These are essentially images that I would like to loop through on a .each statement and get the url. I frankly don't know what all that Proto stuff is? But I'm not really interested in outputting any of it.

This is what I'm doing:

$(data.images).each(function(index, value) {

console.log(this.url); // This is what is outputting the array you see above 

});

I'm getting the URL but I'm also getting "undefined" which is breaking the image if I try to do this in the .each loop...

$(data.images).each(function(index, value) {
$('#myContainer').append("<img src='" + this.url + "'>");
});

Thanks in advance for suggestions and help.

EDIT - I was asked to post the entire string. If I console.log(data) this is what I get. It's a huge array of... well, stuff. I did not expand open every object but I believe this will give you an idea of the structure of the entire object. Before I was trying to pair it down to just where I was having trouble but if you believe the entire string will help, here it is.

Object
    availability: Objectcode: "M"__proto__: Object__defineGetter__: __defineGetter__() { [native code] }__defineSetter__: __defineSetter__() { [native code] }__lookupGetter__: __lookupGetter__() { [native code] }__lookupSetter__: __lookupSetter__() { [native code] }constructor: Object() { [native code] }hasOwnProperty: hasOwnProperty() { [native code] }isPrototypeOf: isPrototypeOf() { [native code] }propertyIsEnumerable: propertyIsEnumerable() { [native code] }toLocaleString: toLocaleString() { [native code] }toString: toString() { [native code] }valueOf: valueOf() { [native code] }get __proto__: __proto__() { [native code] }set __proto__: __proto__() { [native code] }

    averageDealerMargin: "0.50"
    currency: "USD"
    customFields: Array[0]
    image: "http://pathtoaimage.jpg"
    // Here's the trouble maker...
    images: Array[2]0: Objectname: ""url: "http://pathtoanotherimage.jpg"__proto__: Object1: Array[0]length: 2__proto__: Array[0]
    locale: "en-US"
    name: "ProductName"
    partNumber: "700"
    price: "19.99"
    priceDisplay: "$19.99"
    shippingMethod: "3"
    weight: Object
        units: "lb"
         value: "1.8"
__proto__: Object__proto__: Object

Apologies if it wasn't totally clear before, I really do appreciate the assistance here. I've been banging my head on this one for about 2 days on and off.

One more edit... One answer on here did click into something I didn't consider with the absence of a return on a function. To expand further on how I'm pulling on this data is using functions because I'm checking first that the product I'm referencing is legit. This is Shopatron API FWIW, the documentation has been, lacking, would be a nice way to put it... so anyway you'll see reference to that at the top of script like so:

var partNumber = '<?php echo $productID; ?>';
    $(document).ready(function() {
        Shopatron.getProduct({
            partNumber: partNumber
        },{
            success: function(p) {
                outputProductName(p);
                outputProductImage(p);
                outputProductAdditionalImages(p);
                outputProductPrice(p);
                outputDescription(p);
                outputSpecs(p);
            },
            templateFriendly : false                                
        }
    );

Now my function down below follows:

function outputProductAdditionalImages(data) {
    $('#myContainer').append("<img src='" + this.url + "'>");
});
share|improve this question

closed as off-topic by Flexo Jul 19 at 12:19

This question appears to be off-topic. The users who voted to close gave this specific reason:

  • "Questions seeking debugging help ("why isn't this code working?") must include the desired behavior, a specific problem or error and the shortest code necessary to reproduce it in the question itself. Questions without a clear problem statement are not useful to other readers. See: How to create a Minimal, Complete, and Verifiable example." – Flexo
If this question can be reworded to fit the rules in the help center, please edit the question.

1  
I'm getting the URL but I'm also getting "undefined" "also" how? – Jan Jul 17 at 0:34
    
what is the result of your console.log? – Tyler Davis Jul 17 at 0:35
1  
looks like this.url isn't defined in every data.images - so check if (data.images.hasOwnProperty('url')) first – psalmody Jul 17 at 0:36
    
Can you edit your question to include the exact text string returned by this API? I have trouble believing that what's in the question is the actual text that the API sends down. – Michael Geary Jul 17 at 1:05
    
I added the console.log(data) so you can see the entire object. Thanks – SpatialAnomaly Jul 17 at 17:30

2 Answers 2

Try using $.each this way:

$.each(data.images, function(i, obj) {
    if (obj.url) {
        $('#myContainer').append("<img src='" + obj.url + "'>");
    }
});

See if that does the trick.

share|improve this answer

I think you are facing following situation:

In short, a function in javascript that does not have a return value, returns undefined. See this image as example:

enter image description here

Also, you may refer to this other answer

share|improve this answer
    
What function would he be calling that is returning undefined? – Frank Fajardo Jul 17 at 7:16

Not the answer you're looking for? Browse other questions tagged or ask your own question.