Javascript write array to string for use in function

Question

The following function gets a few variables from a table and puts them in an array:

var data = [];

function getInfo() {
    var tds = null;
    $('tr.dirRow').each(function () {
        // Get child <td>s of each .dirRow class <tr>s
        var tds = $(this).children();

        // Get/sanitize information for new table
        var fullName = tds.eq(1).text();
        var org = tds.eq(4).text(); //other variables...

        // Push data
        if (fullName) {
            data.push({
                "id": fullName,
                "org": org //other variables...
            });
        }
    });

}

I have a function that creates an org chart:

function createOrgChart() {
        var peopleElement = document.getElementById("people");
        var orgChart = new getOrgChart(peopleElement, {
            theme: "sara",
            dataSource: document.getElementById("orgChartData"),
            customize: {
                //***Need help getting this information in this spot***
                // "id": { color: "green" }, <--this is what the data should be formatted like
            }
        });

    }

I can correctly console.log() the information I want in the commented section above, based on the for() loop below, but I can't figure out how to output to the "customize" section, in the format it needs to be.

Code that correctly logs the output I desire in the "customize: {" section of the function above:

for (var i = 0; i < data.length; i++) {
    if (data[i].org.substring(0, 4) == "Dep1") {
        console.log("\"" + data[i].id + "\": { color: \"green\"},");
        //results in:
        //"id1": { color: "green" },
    } else if (data[i].org.substring(0, 4) == "Dep2") {
        console.log("\"" + data[i].id + "\": { color: \"red\"},");
        //results in:
        //"id2": { color: "red" },
    }
}

Data array, as requested in comments:

 [Object { id="First Last",  parentID="Supervisor Name",  org="Dep1",  more...}, Object { id="First2 Last2",  parentID="Supervisor2",  org="Dep2",  more...}, //more objects

Final code that worked for me if it helps anyone else:

var data = [];
var customize = {};
var orgColors = {
    'Dep1': { color: "blue" },
    'Dep2': { color: "green" },
    'Dep3': { color: "grey" }
}

$(document).ready(function () {
    getInfo();
    createOrgChart();
});

function getInfo() {
    var tds = null;
    $('tr.dirRow').each(function () {
        // Get child <td>s of each .dirRow class <tr>s
        var tds = $(this).children();

        // Get/sanitize information for new table
        var fullName = tds.eq(1).text();
        var org = tds.eq(4).text(); //other variables...

        // Push data
        if (fullName) {
            data.push({
                "id": fullName,
                "org": org //other variables...
            });
        }

        customize[fullName] = orgColors[org.substring(0, 4)];

    });

}
function createOrgChart() {
    var peopleElement = document.getElementById("people");
    var orgChart = new getOrgChart(peopleElement, {
        theme: "sara",
        dataSource: document.getElementById("orgChartData"),
        customize: customize
    });

}

I have the data in an array - show the format of this array — Jaromanda X
– Jaromanda X, Commented Jan 9, 2017 at 23:27
customize seems to take an object, not a string. Don't construct a JSON literal, construct an object. — Bergi
– Bergi, Commented Jan 9, 2017 at 23:27
@JaromandaX, I added the format, hopefully this is what you were asking for? — troyrmeyer
– troyrmeyer, Commented Jan 9, 2017 at 23:37
Sorry should've been clearer, what is the problem you want to be solved? It's not explained in your question. — David Archibald
– David Archibald, Commented Jan 9, 2017 at 23:37

Chas Brown · Accepted Answer · 2017-01-10 00:05:24Z

4

It's hard to tell exactly what you want, but here's the sort of thing you might try:

var orgFormats = {
    'Dep1': { color: "green"},
    'Dep2': { color: "red"}
}

// then later, when you know what personData is

var customize = {};
customize[personData.id] = orgFormats[personData.org.substring(0, 4)];

var configObject = {
    theme: 'sara',
    dataSource: document.getElementById("orgChartData"),
    customize: customize
};

answered Jan 10, 2017 at 0:05

Chas Brown

3961 silver badge10 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

troyrmeyer Over a year ago

I'm fairly new to Javascript, so having a hard time following your answer. I've added more information and clarification to my question. I see I need to pass an object, but not sure how to construct it.

troyrmeyer Over a year ago

I worked through you answer and was able to modify my code to work, thank you so much!

Collectives™ on Stack Overflow

Javascript write array to string for use in function

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related