Stewartps
Stewartps

Reputation: 55

Show Image from JSON data?

The JSON URL is http://api.bfhstats.com/api/playerInfo?plat=pc&name=1ApRiL&output=js

On line 16 It contains the part "imgLarge" which i'm trying to get to show the image on my website. When i parse the data to my website it is currently just showing the string, not an actual image.

Here's the code I currently have:

$("#playerstuff").submit(function() {
    $.ajax({
        type: "GET",

        url: 'http://api.bfhstats.com/api/playerInfo?plat=' + document.getElementById("platform").value +'&name=' + document.getElementById("playername").value,  
        //datatype : "json",
        success: function(data)
        {
            document.getElementById("playerrank").innerHTML = 'gamingstats.ga/' +data["player"]["rank"].imgLarge;
                            $("#formpanel").hide();
                            $("#dataret").show();
        }
    });
    return false;
});

The output of this is the URL which is gamingstats.ga/bfh/ranks/r57.png however not the actual image.

Upvotes: 0

Views: 476

Answers (1)

cmorrissey
cmorrissey

Reputation: 8583

Change this line ...

document.getElementById("playerrank").innerHTML = 'gamingstats.ga/' +data["player"]["rank"].imgLarge;

to ...

document.getElementById("playerrank").innerHTML = '<img src="http://gamingstats.ga/' +data["player"]["rank"].imgLarge + '" />';

Upvotes: 2

Related Questions