/* * * treetable 0.1-client-side treetable viewer! * @requires JQuery v1.3 * * Dual licensed under the MIT and GPL licenses: * Http://www.opensource.org/licenses/mit-licens e.php * http://www.gnu.org/licenses/gpl.html * * * * (function ($) {$.extend ({treetable:new function () {this.defaults = {id) _col:0,parent_col:1,handle_col:2,order_col: -1,open_img: "Lib/plugin/treetable/images/minus.gif", close_img: "lib/ Plugin/treetable/images/plus.gif ", expanded:true//@author gaobing};//jquery trim does not handle the generated" space "function trim ( STR) {return str.replace (/(^[\s\xa0]*) | ( [\s\xa0]*$)/g, "");} This.construct = function (settings) {if (This.size ()!=1) return;//processes only one table if (This[0].tagname.touppercase ()! = "TBODY") return;//applies only to Tbodyvar config = $.extend ({}, $.treetable.defaults, settings); if (Config.id_col==null | | config.parent_ Col==null | | Config.handle_col==null) Return;var $this = $ (this), var Tr_arr = new Array (), var tr_sort = new Array ();//Build Row Object array $this.fin D ("tr"). each (function () {var id = $.trim ($ (this). Find ("Td:eq ("+config.id_col+")). Text ()), var parent = $.trim ($ (this). Find ("Td:eq (" +config.parent_col+ ")). Text ()); tr_ Arr.push ({' id ': ID, ' parent ':p arent, ' level ': 0, ' node ': ' Leaf ', ' expanded ': config.expanded, ' obj ': $ (This)}); var len = Tr_arr.length;var level = 0;/* checks whether the parent row of each row in the Tr_arr is again tr_sort, and if so, removes it from tr_sort until Tr_arr is null after inserting it into the parent row of Tr_arr. Generate the ordered Tr_sort*/while (len>0) {for (Var i=0;i<tr_arr.length;i++) {var o = tr_arr[i];if (o==null) continue;if ( o.parent== "") {//Gank direct Press into Tr_sorttr_sort.push (o); tr_arr[i]=null;len=len-1;} Else{if (Tr_sort.length > 0) {for (Var j=0;j<tr_sort.length;j++) {if (tr_sort[j].id==o.parent) {o.level = Tr_sort[j ].level+1;//build hierarchy from parent line leveltr_sort[j].node= ' node '; Tr_sort.splice (j+1,0,o);//array insert Tr_arr[i]=null;len=len-1;break;}}} Else{for (var k=0;k<tr_arr.length;k++) {var ok = tr_arr[k];if (ok = null) continue;if (o.id! = ok.parent && OK.PA Rent = "") {Ok.level = Tr_arr[k].level+1;tr_sort.push (ok); tr_arr[i]=null;len=len-1;} Else{if (Tr_sort[k]) {o.level = tr_sort[k].level+1;//cumulative build from parent rowHierarchy leveltr_sort[k].node= ' node '; Tr_sort.splice (k+1,0,o);//array insert Tr_arr[i]=null;len=len-1;break;}}}}} level=level+1;} while//Expansion event Action function var Fn_click = function () {var id = Trim ($ (this). Parent (). Parent (). Find ("Td:eq (" +config.id_col+ "). Text ());//get current line Idvar v = -1;for (var j=0;j<tr_sort.length;j++) {var o = tr_sort[j];if (o.id==id) {//Find row object in Tr_sort if ( o.node== ' leaf ') return;v = O.level;var img = O.obj.find ("Td:eq (" +config.handle_col+ ") img") [0];if (!o.expanded) {/// Judging by the icon is expanded or closed img.src=config.open_img;o.expanded=true;} Else{img.src=config.close_img;o.expanded=false;} var show = O.expanded;var F = false;//parent line off flag var tmp = 0;//parent row hierarchy for (Var i=j+1;i<tr_sort.length;i++) {//update subsequent sub-rows according to level o = Tr_sort[i];var img = O.obj.find ("Td:eq (" +config.handle_col+ ") img") [0];var t =!o.expanded;//Determines if it is a closed state if (o.level>v && show) {//expand operation if (!f&&!t) {//Parent line is not closed and the current line is expanded state o.obj.show ();} else if (!f&&t) {//Parent line is not closed, and the current line is a closed state TMP = O.LEVEL;F = True;o.obj.show ();} else if (f&&o.level<=tmp) {//The previous line of the sibling is the closed state if (!T) {F=false;} Else{tmp = O.level;} O.obj.show ();} else{;}} else if (o.level>v &&!show) {//closed operation is hidden so child row O.obj.hide ();} else if (o.level<=v) {//arrives non-child row, processing is finished break;}} break;}}};/ /Redraw table, add expand Action icon for (Var j=tr_sort.length-1;j>-1;j--) {//prepend Insert tbody domestic demand use reverse-order var o = Tr_sort[j];var img = $ (" "); Img.click (Fn_click); var tr=o.obj.find (" Td:eq ("+config.handle_col+") ");// Avoid repeating add icon var imgele = tr.find ("img"), if (imgele.length = = 0) {tr.prepend (" "); Tr.prepend (IMG); var s = new Array (( o.level+1). Join (" ");//Generate Indentation space tr.prepend (s); $this. prepend (O.obj);}} for/* * @author gaobing * Whether to expand when expanded is false, the parent node shrinks * */if (tr_sort.length > 0) {for (Var i=0;i<tr_sort.length;i+ +) {var o = tr_sort[i];//Line object var img = O.obj.find ("Td:eq (" +config.handle_col+ ") img");//parent node icon element if (o.expanded = = False) {// Shrink//Check if there is a parent node that hides the bank node if (o.parent! = "") {o.obj.hide ();//Hide child nodes}//Check for child nodes, have child nodes replace icon for (Var j=0;j<tr_ sort.length;j++) {if (Tr_sort[j].parent! = "" && TR_SORT[J].Parent = = O.id) {//Have child nodes $ (IMG). attr ("src", config.close_img);//Replace parent node icon}}}}}}//construct}//treetable}); $.fn.extend ({ Treetable: $.treetable.construct});}) (jQuery);/** * @author gaobing * Function: Sort the tree Table parent node in the former child node after **/function treetable_sort (tableid,parentcolumn) {var TRS = new Array ();//Get All Rows $ ("#" + tableId + "tbody tr[role= ' Row ']"). each (function (index) {Trs[index] = $ (this). Clone (True); /empty before the row data $ ("#" + tableId + "tbody"). empty ();//recursive Sort_tr_root (Trs,tableid,parentcolumn);} /* Root node sort */function sort_tr_root (trs,tableid,parentcolumn) {var Rootarr = new Array (); for (Var i=0;i<trs.length;i++) { if (null! = Trs[i]) {var trsdata = trs[i].attr ("Data"), var trsdataobj = eval (' (' + trsdata + ') '); var trsid = trsdataobj[' I d '];var Trsparentid = trsdataobj[ParentColumn];if (null = = Trsparentid | | trsparentid = "" "| | undefined = = Trsparentid) {//outermost root trs[i].attr ("id", TRSID); $ ("#" + tableId + "Tbody"). Append (Trs[i]); Rootarr.push (trs[ I]); trs[i] = null;}}} Sub-node sort var treedata = Changedatatomap (TRS); var Result = Createsearchmap (trs,parentcolumn); for (Var i=0;i<rootarr.length;i++) {var rootdata = rootarr[i].attr ("Data"); var rootdataobj = eval (' (' + rootdata + ') '); var rootid = rootdataobj[' id '];var Rootparentid = rootdataobj[ParentColumn] ; BuildChild (Tableid,treedata,result,rootid,rootparentid);}} function Createsearchmap (data,parentcolumn) {//Create search key value pair var result = {};for (var i=0;i<data.length;i++) {if (null! = Data[i]) {var trsdata = data[i].attr ("Data"), var trsdataobj = eval (' (' + trsdata + ') '); var trId = trsdataobj[' id '];var TrP Arentid = Trsdataobj[parentcolumn];if (Trparentid) {if (!result[trparentid] && Trparentid! = null && Trparentid = "") {Result[trparentid] = [];} Result[trparentid].push (trId);}}} return result;} function Changedatatomap (TRS) {var deepmap = new Array (); for (Var i=0;i<trs.length;i++) {if (null! = Trs[i]) {var trsdata = Trs[i].attr ("Data"), var trsdataobj = eval (' (' + trsdata + ') '), var trId = trsdataobj[' id '];if (trId) {Deepmap[trid] = trs[ I];}}} Return DEEPMAP;} function BuildChild (Tableid,treedata,result,id,parentid) {if (ParentID) {var trobj = treedata[id];trobj.attr ("id", ID) ; $ ("#" + tableId + "tbody tr[role=row][id=" + ParentID + "]"). After (Trobj); var childrenids = result[id];if (childrenids) {for (Var i=0;i<childrenids.length;i++) {BuildChild (Tableid,treedata, Result,childrenids[i],id);}}} /* Determine if an element is included */array.prototype.contains = function (Element) {//Use the prototype of Array prototype point out a method name I want to encapsulate containsfor (var i = 0; i < this.length; i++) {if (this[i] = = Element) {//If an element in the array is equal to the element object you want to test, the proof array contains this element and returns Truereturn true;}}; /** * @author gaobing * Function: Table tree for DataTable call Interface **/function inittreetable (obj) {//parameter var tableId = obj.tableid;//Table Idvar tbod Yid = obj.tbodyid;//table Tbodyidvar isexpanded = obj.isexpanded;//Expand all nodes var viewconfig = obj.viewconfig;//show config var ParentColumn = obj.parentcolumn;//Parent column//Sort parent node in front of child node Treetable_sort (tableid,parentcolumn);//default property $. Treetable.defaults={id_col:viewconfig[0],//id TD column {starting from 0}parent_col:viewconfig[1],//Parent ID TD Column HANDLE_COL:VIEWCONFIG[2],//operation expanded TD column Open_img: "Lib/plugin/treetable/images/minus.gif",//Expand icon Close_ IMG: "Lib/plugin/treetable/images/plus.gif",//contraction when the icon expanded:isexpanded//true to expand, false for contraction}; Spanning Tree $ ("#" + Tbodyid). treetable (); Hide data Columns $ ("#" + Tbodyid + "tr"). Find ("Td:eq (" + viewconfig[0] + ")"). Hide (); $ ("#" + Tbodyid + "tr"). Find ("Td:eq" + VIEWC ONFIG[1] + "). Hide (); $ (" # "+ TableId +" Tr:eq (0) "). Find (" Th:eq ("+ viewconfig[0" + ")"). Hide (); $ ("#" + tableId + "Tr:e Q (0) "). Find (" Th:eq ("+ viewconfig[1] +") "). Hide ();
Treetable implementation Sequencing