Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted on Jul 27, 2008 07:49
open dhtmlx forum
Default plus sign???

Hi,

I want to load data's dynamically in the tree,when ever the user clicks the plus button..
So 1st iam loading a parent node with 3 child nodes.The 3 child node inturn will surely have child nodes which i want to bring only when the user clicks the plus button.
Is there any way to put a default plus sign??
I want to handle the click event only for the child nodes and bring their child nodes through XML.How should we do this???
Should i write another XML or can i append along with the one i wrote initialy for writing the parent nodes????
Answer posted by Support on Jul 28, 2008 03:01
Tree has built in support for dynamical loading.
You need
    a) add tree.setXMLAutoLoading command to the tree init
    b) in XML generated for top level, items which need to be loaded dynamically must have "child" atribute

http://dhtmlx.com/docs/products/dhtmlxTree/samples/loading_processing_data/tree_dyn_loading.html?un=1217240290000

>>Should i write another XML or can i append along with the one i wrote initialy for writing the parent nodes????
    By default tree will use url defined inn setXMLAutoLoading and add to it "id" parameter with value of parent node ID. Such scenario oriented on using server side script which will otput diffrerent data     based on id parameter. The url generation can be changed by using setXMLAutoLoadingBehaviour command.


http://dhtmlx.com/docs/products/dhtmlxTree/doc/dyn_loading.html#dyntree
Answer posted on Jul 28, 2008 06:33

Thanks for your response..I have few more doubts..

function doOnLoad(){
 var jobNavigationString;
 jobNavigationString = "JobNavigationAction.do?param=loadGrid";
 tree1=new dhtmlXTreeObject('jobNavigationBox',"100%","100%",0); 
 tree1.setImagePath("images/"); 
 tree1.enableHighlighting(true); 
 // enable/disable tree lines
 tree1.enableTreeLines(true);
 // set plus images
 tree1.setImageArrays("plus3.gif","plus2.gif","plus4.gif","plus.gif","open2.gif");
 //set minus images
 tree1.setImageArrays("minus3.gif","minus2.gif","minus4.gif","minus.gif","close2.gif");
 //set default node images
 tree1.setStdImages("safe_close.gif","safe_open.gif","safe_close.gif");
 tree1.setXMLAutoLoading(jobNavigationString);
 tree1.loadXML(jobNavigationString);
 tree1.setOnOpenHandler(aFunc); 
}

function aFunc (id)
{
 alert(id);
 jobNavigationString = "JobNavigationAction.do?param=loadDocType&id="+id;
 tree1.loadXML(jobNavigationString);
}

This is how iam doing..

But here every time i click the plus(+) button the server side code gets excecuted and loads the child nodes but next time again i click it should close the node and minus (-) should come,but instead

again server call happens and duplicate data's are coming...Is there any function to determine the close functionality or am i missing some thing?

Answer posted by Support on Jul 28, 2008 09:12
The code which you are using has custom onOpen handler, which will call data loading each time when item closed|opened.
Basically, if you are using xml auto-loading mode, you need not use any additional handlers.

 tree1.setXMLAutoLoading(jobNavigationString);
 tree1.loadXML(jobNavigationString);
// tree1.setOnOpenHandler(aFunc);  <= this line is not necessary, the grid will call loadXML automatically in auto-loading mode
Answer posted on Jul 28, 2008 21:23

Thank you again..I commented the But iam not very clear with the flow where we change the URL..

I implemented this way,

  .
  // Tree implementation
  .
  jobNavigationString = "JobNavigationAction.do?param=loadGrid";
  jobNavigationString1 = "JobNavigationAction.do?param=loadDocType";
  jobNavigationString2 = "JobNavigationAction.do?param=load_JobType_bookView";
  tree1.loadXML(jobNavigationString);
  tree1.setXMLAutoLoading(jobNavigationString1);

Now this loads the first level of child..Now how will i proceed further to
load the next level of child nodes with URL jobNavigationString2???

When i simply give

  tree1.setXMLAutoLoading(jobNavigationString2); ....The second level of child is only loaded..


what is XMLAutoLoadingBehaviour command???
Can you pls give an example???

 

Answer posted by Support on Jul 29, 2008 01:51
By default component will use url , defined by setXMLAutoLoading command for all next levels.
If you need different urls for different levels , you can try the next

    tree1.loadXML(jobNavigationString);
    tree1.setXMLAutoLoadingBehaviour("function"); //instead of url, function will be expected as parameter of setXMLAutoLoading
    tree1.setXMLAutoLoading(function(id){   //will be called each time when data requested
       var level = tree1.getLevel(id);
       var url="";
        if (level == 2) url=jobNavigationString1;   //different urls for different levels
        if (level == 3) url=jobNavigationString2;
       grid.loadXML(url+"&id="+id);   //load data
    });