getorgchart secondParentIdField error with html table or csv source

Question

I'm testing getorgchart and require secondary parent on some entries.

Whenever I run I get error:

TypeError: t is undefined

If I comment out the following line it loads and shows the chart - without the seocndard links:

    secondParentIdField: "secondKey",

I'm using HTML tables as the source, I've also tried CSV.

I have found this which links back to the original documentation:

GetOrgChart-multiple parents for a child node

This is using JSON as the source and list secondParenId only when needed (example: http://www.getorgchart.com/Demos/Second-Parent-Relation)

I wonder if this is a mark up issue with HTML/CSV vs JSON. I've tried adding value null and 0 to the html table but it still shows the same error.

HTML Table Source - note that I'm editing the example files so it's loading jquery and the getorgchart files correclty:

    <table id="orgChartData">
    <tr>
      <th>Key</th>
      <th>parentKey</th>
      <th>secondKey</th>
      <th>team</th>
      <th>name</th>
      <th>title</th>
      <th>email</th>
      <th>dd</th>
      <th>mob</th>
      <th>image</th>
    </tr>
    <tr>
      <td>1</td>
      <td></td>
      <td></td>
      <td></td>
      <td>Test 1</td>
      <td>Tile 1</td>
      <td>[email protected]</td>
      <td>0000 123456</td>
      <td>0000 123456</td>
      <td>person.jpg</td>
    </tr>
    <tr>
      <td>2</td>
      <td>1</td>
      <td>3</td>
      <td></td>
      <td>Test 2</td>
      <td>Title 2</td>
      <td>[email protected]</td>
      <td>0000 123456</td>
      <td>N/A</td>
      <td>person.jpg</td>
    </tr>
    <tr>
      <td>3</td>
      <td>1</td>
      <td></td>
      <td></td>
      <td>Test 3</td>
      <td>Title 3</td>
      <td>[email protected]</td>
      <td>0000 123456</td>
      <td>0000 123456</td>
      <td>person.jpg</td>
    </tr>
    <tr>
      <td>4</td>
      <td>5</td>
      <td>2</td>
      <td></td>
      <td>Test 4</td>
      <td>Title 4</td>
      <td>[email protected]</td>
      <td>0000 123456</td>
      <td>N/A</td>
      <td>person.jpg</td>
    </tr>
    <tr>
      <td>5</td>
      <td>3</td>
      <td></td>
      <td>Business Development ePractice</td>
      <td>Test 5</td>
      <td>Title 4</td>
      <td>[email protected]</td>
      <td>0000 123456</td>
      <td>0000 123456</td>
      <td>person.jpg</td>
    </tr>

JavaScript:

    <script type="text/javascript">
        var peopleElement = document.getElementById("people");
        var orgChart = new getOrgChart(peopleElement, {
            idField: "Key",
            secondParentIdField: "secondKey",
            theme: "monica",                
            linkType: "M",
            primaryFields: ["name", "title", "email"],
            photoFields: ["image"],
            enableGridView: true,
            enableEdit: false,
            expandToLevel: 2,

            dataSource: document.getElementById("orgChartData"),

        });

</script>

EDIT:

After some debugging the major difference in the data between JSON & from HTML is:

To get this info add

console.log(this.nodes);

After

   for (var e in this.nodes) {

From HTML:

spid: ""

From JSON:

spid: undefined

This is outputting

Fix that worked for me in the code, in function:

getOrgChart.node = function(d, f, h, c, g, e, a, b) {

Add this:

h = (h == "") ? undefined : h;

Before:

this.spid = h;

This would need fixing in the orginal code, I've just de-minified this to debug.

Answer 1

The issue is addressed in the latest version 2.4.5