faq.html

用js做的树 用js做的树 用js做的树

<div style="position:absolute;left:80%;background-color:white;right:20;width:150;">
<a onclick="expandAll(true)" href="javascript:void(0)">expand</a>|<a onclick="expandAll(false)" href="javascript:void(0)">collaps</a>
</div>
<script>
			
			function openFull(el){
				var nextSib = getDivSibling(el);
				nextSib.style.display=='none'?nextSib.style.display='block':nextSib.style.display='none'
			}
			function getDivSibling(el){
				var sib = el.nextSibling;
				for(var i=0;i<10;i++){
					if(sib.tagName=="DIV")
						break;
					else
						sib = sib.nextSibling;
				}
				return sib;
			}
			function expandAll(fl){
				var elAr = document.getElementsByTagName("DIV");
				for(var i=1;i<elAr.length;i++){
					if(elAr[i].style.display=='none' || elAr[i].block_fl){
						elAr[i].block_fl = true;
						if(fl)
							elAr[i].style.display = "";
						else
							elAr[i].style.display = "none";
					}
				}
			}
			
		</script>
<style>
			.{font-family:arial;}
			h2 {cursor:pointer;font-size:16px;margin-left:10px;line-height:10px}
			h3 {cursor:pointer;font-weight:normal;color:gray;text-decoration:underline;line-height:10px}
			div.block {margin-left:30px;}
			xmp{color:green;background-color:lightgrey;padding:3px;}
		</style>
<h2 onclick="openFull(this)">F.A.Q.</h2>
<div onclick="openFull(this)" style="display:block" class="block">
<a name="kb_faq_lic"></a><h3>Licensing</h3></a>
</div>
<div style="display:;margin-left:5px;margin-top:2px;">
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>May I use dhtmlxTree Standard Edition in my commercial projects for free?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">No. To use any edition in commercial project you need to purchase a Commercial or Enterprise License.</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>How much does the professional version cost? Is it included with the commercial license?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">You'll get Professional Edition when you purchase Commercial ($99) or Enterprise ($399) License.</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>What is the difference between Commercial and Enterprise Licenses?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">There are two main differences: 
<li>According to Enterprise license you may use dhtmlxTree in any number of your projects, whereas Commercial License allows using dhtmlxTree in one project per license</li>
<li>Supporting period (as well as period of free upgrade) is 1 month for Commercial and 1 year for Enterprise License.</li></div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>How can I get Professional Edition of dhtmlxTree?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">To get Professional Edition of dhtmlxTree you need to purchase Commercial or Enterprise License. Right after that you'll get Professional Edition together with additional sample files by email.</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>Are the "pro" features available in the file downloaded from the site for evaluation, or do we have to buy a different file to try it out?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">You can download only Standard Edition from the site. If you want to evaluate Professional Edition please write us - [e-mail]</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>Will I get commented not obfuscated sources together with Professional Edition?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">Yes.</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>Is there some special documentation available with Professional Edition?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">No. There is only one variant of documentation. All methods specific for Professional Edition marked in documentation with red colored text "Professional" or "Commercial". </div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>May I modify dhtmlxTree and use modified files in my project?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">Yes you may. At the same time according to the License Scand LLC remains the owner of all modifications in the code.</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>How to buy dhtmlxTree License?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">Please send email to [e-mail] and you'll get necessary instructions right away.</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>May I distribute dhtmlxTree as a part of my application? What License do I need for this? Should I buy additional License for each copy of my application?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">You may distribute dhtmlxTree as a part of you application if this application is not competitor to dhtmlxTree. You can use either Commercial or Enterprise License.  Only one license necessary for one application - irregardless to number of copies sold.</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>My licensing question regards including your dhtmlxtree code in a commercial product which will be redistributed and run on clients' machines.  I'm curious whether this would require a license on each client machine, or whether my company would simply need to license the code once for inclusion in the code base.</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">Only once.</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>Can we modify dhtmlxTree code and/or change some functionalities in order to match our requirements.</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">Modifications to the software are allowed, and you may distribute it as a part of your application, but distribution of the modified software as a standalone component or as a part of concurrent software is forbidden. </div>
</div>
<div onclick="openFull(this)" style="display:block" class="block">
<a name="kb_faq_perf" id="kb_faq_perf"><h3>Performance. Dynamical Loading</h3></a>
</div>
<div style="display:;margin-left:5px;margin-top:2px;">
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>How can I load xml dynamically, so that the loading gets done more quickly?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">
As you know dhtmlXTree supports dynamical loading for such purposes. Dynamical loading means loading data on request. To make tree do this use method <em>tree.setXMLAutoLoading(url)</em><br>
In this case your xml should contain only necessary nodes. For example initial xml should contain only nodes of top level. To let the tree know that some node has children, use child="1". Like this:
	<xmp>
	<tree id="0">
		<item  text="Surveillance" id="a1" im0="book.gif"  child="1"/>
		...
		<item text="Low income countries" id="a333" im0="book_titel.gif"  child="0"/>
	</tree>	
	</xmp>
When user trying to open node which has children, tree looks for data on client side first - if no data found, then it goes to server using URL specified in method mentioned above with ID of node added to it, like: http://127.0.0.1/myTree/tree.cfm?id=a1, where "a1" is ID of the node which should be opened. Using this ID you can create another xml, which contains only child nodes of opening node. Like this:
	<xmp>
	<tree id="a1">
		<item text="Bilateral surveillance" id="a2"  />
		...
	</tree>
	</xmp>
	
As dynamical loading needs to process incoming url parameters and generate xml file content based on it to work really useful, it would be good to use some server side programming language like ASP, ColdFusion, JSP, PHP or any other for this. 
</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>Is there any solution for increasing tree performance when it contains hundreds or thousands of nodes?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">There are two ways:<br>
<li>Dynamical loading. In this case tree contains only nodes which were already opened and it doesn't really matters how much nodes are in the datasource .</li>
<li>Advanced XML Processing (available in Professional edition). In this case the whole xml documents loaded on client side, but only nodes which are visible are created in tree. This increases performance and decreases loading time.</li></div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>What happens is that the nodes get drawn as siblings of the root and not as children of the expanded node.</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">The reason is in xml file. It always contains the same ID of parent element: <xmp><tree id="every-time-id-of-super-root-level"></xmp>, but it should be <xmp><tree id="id-of-node-that-was-expanded"></xmp></div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>Dynamical Loading always loads the whole tree and adds it to existing one.</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">XML file for initial loading should contain ONLY top level of the tree, xml that loads children should contain ONLY necessary nodes - so in most cases it generated with some server side routine using incoming "id" of parent node (node that was opened) which is passed to the file while calling it.</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>I've created simple xml containig 10 000 nodes and ... after 30second IE almost breaks down with a warning</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">As performance is a weak place of DHTML, we implemented two ways of processing big trees. First is dynamical loading - xml loaded from server by parts (on request). This feature available in all editions. Second is "advanced xml processing" - xml loaded at once, but processed by parts on request. This feature available in pro edition only.</div>
</div>
<div onclick="openFull(this)" style="display:block" class="block">
<a name="kb_faq_dnd" id="kb_faq_dnd"><h3>Drag-n-drop, Nodes ordering</h3></a>
</div>
<div style="display:;margin-left:5px;margin-top:2px;">
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>Is there any way to rearrange the nodes without reloading the tree?</li>
</div>
<div style="display:none;margin-left:20px;margin-top:2px;font-size:16px;">You can rearrange nodes with script (moveItem method) or using drag-n-drop (drop-as-sibling type)</div>
<div onclick="openFull(this)" style="margin-top:5px;color:blue;cursor:pointer;margin-top:10px;">
<li>Can we use different drag-n-drop types for different nodes? For example we need drop-as-sibling for files and drop-as-child for folders.</li>