2

Im using GetOrgChart, and I'm trying to add a function so when you close top level and then exapand it again, it should only show the children dirrectly under it.

Here is my Demo:

var orgchart = new getOrgChart(document.getElementById("people"), {
      primaryFields: ["name", "title", "phone", "mail"],
      expandToLevel: 4,
      dataSource: [{
        id: 1,
        parentId: null,
        name: "Amber McKenzie",
        title: "CEO",
        phone: "678-772-470",
        mail: "lemmons@jourrapide.com",
        adress: "Atlanta, GA 30303"
      }, {
        id: 2,
        parentId: 1,
        name: "Ava Field",
        title: "Paper goods machine setter",
        phone: "937-912-4971",
        mail: "anderson@jourrapide.com"
      }, {
        id: 3,
        parentId: 1,
        name: "Evie Johnson",
        title: "Employer relations representative",
        phone: "314-722-6164",
        mail: "thornton@armyspy.com"
      }, {
        id: 4,
        parentId: 1,
        name: "Paul Shetler",
        title: "Teaching assistant",
        phone: "330-263-6439",
        mail: "shetler@rhyta.com"
      }, {
        id: 5,
        parentId: 2,
        name: "Rebecca Francis",
        title: "Welding machine setter",
        phone: "408-460-0589"
      }, {
        id: 6,
        parentId: 2,
        name: "Rebecca Randall",
        title: "Optometrist",
        phone: "801-920-9842",
        mail: "JasonWGoodman@armyspy.com"
      }, {
        id: 7,
        parentId: 2,
        name: "Spencer May",
        title: "System operator",
        phone: "Conservation scientist",
        mail: "hodges@teleworm.us"
      }, {
        id: 8,
        parentId: 6,
        name: "Max Ford",
        title: "Budget manager",
        phone: "989-474-8325",
        mail: "hunter@teleworm.us"
      }, {
        id: 9,
        parentId: 7,
        name: "Riley Bray",
        title: "Structural metal fabricator",
        phone: "479-359-2159"
      }, {
        id: 10,
        parentId: 7,
        name: "Callum Whitehouse",
        title: "Radar controller",
        phone: "847-474-8775"
      }]
    });


    
html,
body {
  margin: 0px;
  padding: 0px;
  height: 100%;
  overflow: hidden;
}

#people {
  width: 100%;
  height: 100%;
}
<link href="http://www.getorgchart.com/GetOrgChart/getorgchart/getorgchart.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://www.getorgchart.com/GetOrgChart/getorgchart/getorgchart.js"></script>
<div id="people"></div>

So if you click on the - at Amber McKenzie, Then it close the entire orgchart. Then when you click the + then it opens it up like it was before.

What I would like is when you click the + button, it shows only the children directly below. aka Ava Field - Evie Johnson - Paul Shetler

Here is my own attempt to make it myself.

0 Answers0