Skip to content

Added option to pass in javascript object. #24

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
goldenhooves wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Added option to pass in javascript object. #24

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ecf311b
Option to pass in javascript object instead of list
davidherse Jun 22, 2012
dd65759
Option to pass in javascript object instead of list
davidherse Jun 22, 2012
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
47 changes: 45 additions & 2 deletions jquery.jOrgChart.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,15 +10,26 @@
* Copyright (c) 2011 Wesley Nolte
* Dual licensed under the MIT and GPL licenses.
*
* Ability to accept javscript object added by David Herse
* http://davidherse.com
*
*/
(function($) {

$.fn.jOrgChart = function(options) {
var opts = $.extend({}, $.fn.jOrgChart.defaults, options);
var $appendTo = $(opts.chartElement);

// build the tree
$this = $(this);
if(opts.dataObject){
// create a list from an object
$this = $(createListItem('ul')).attr("id" , 'workflow_list');
buildList(opts.dataObject, $this);
$('body').append($this.hide());
} else {
// build the tree
$this = $(this);
}

var $container = $("<div class='" + opts.chartClass + "'/>");
if($this.is("ul")) {
buildNode($this.find("li:first"), $container, 0, opts);
Expand Down Expand Up @@ -102,6 +113,38 @@
dragAndDrop: false
};

var createListItem = function(){
var workflow_li = '<li class="list_item"></li>',
workflow_ul = '<ul class="list"></ul>';
return function(type, value){
if(type == 'ul'){
return $(workflow_ul);
} else {
return $(workflow_li).addClass(value).text(value);
}
};
}();

var buildList = function(items, parent){
for(var name in items){
if(parent.hasClass('list')){
parent.append(createListItem('li', name));
} else {
var child_ul = parent.children('ul');
if(child_ul.length == 0){
parent.append($('<ul/>'));
}
parent.children('ul').append(createListItem('li', name));
}
if(typeof items[name] == 'object'){
var new_parent = parent.find('.'+name);
buildList(items[name], new_parent);
} else {
parent.find('.'+name).text(parent.find('.'+name).text()+" : "+items[name]);
}
}
};

var nodeCount = 0;
// Method that recursively builds the tree
function buildNode($node, $appendTo, level, opts) {
Expand Down
11 changes: 11 additions & 0 deletions readme.markdown
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,17 @@ This call will append the markup for the OrgChart to the `<body>` element by def

----

-----

###Option to pass in javascript object

Excluded the 'chartElement' parameter and add a 'dataObject' parameter. For example:

$("#chart").jOrgChart({
dataObject : jsObject
});

----
##Demo

You can view a demo of this [here](http://bit.ly/u1XhTf "jQuery OrgChart").
Expand Down