Inlcuding variable into document.getElementById not working

Question

<form action="results.html" method="GET">
    <select class="soflow" onchange="getGoalkeeper(this)">
        <option value="">Select a stat...</option>
        <option value="saves">Saves</option>
        <option value="goals_conceded">Goals Conceded</option>
        <option value="clean_sheets">Clean Sheets</option>
        <option value="penalties_saved">Penalties Saved</option>
        <option value="goals_scored">Goals</option>
        <option value="assists">Assists</option>
        <option value="yellow_cards">Yellow Cards</option>
        <option value="red_cards">Red Cards</option>
        <option value="penalties_missed">Penalties Missed</option>
    </select>
    <input type="submit" value="submit"/>
</form>

index.html

var json = //json data

function getGoalkeeper(selectObject) {
var value = selectObject.value;
var position = 1;
var fr = $(json).filter(function (i,n){return n.element_type===position });

for (var i=0;i<fr.length;i++)
{
document.getElementById('result').innerHTML += "<span class='statistic' id=" + fr[i].id + "><a href='https://platform-static-files.s3.amazonaws.com/premierleague/photos/players/110x140/p" + fr[i].code + ".png'>" + fr[i].clean_sheets + "</a></span>" +"<br />";
}}

script.js

I am trying to get the variable "value" to replace "clean_sheets" so rather than "fr[i].clean_sheets" I would like "fr[i]. + value" but this is not working and is returning "Uncaught SyntaxError: Unexpected token +" in the console. How can I fix this?

I suggest you to put string that you concat into braces. like this document.getElementById('result').innerHTML += ("" + fr[i].clean_sheets + "" +"
"); — Anton M., Mar 14 '17 at 18:27

score 0 · Accepted Answer · answered Mar 14 '17 at 18:28

Simply you have to use the same way as when you loop through an object properties. I mean, the same way as you do fr[i] to acces the property i, you need to do fr[i][value], to access the property value.

PD: Although fr is an Array, each index is accessed the same way as properties in objects.

Inlcuding variable into document.getElementById not working

1 Answers1