Location: PHPKode > projects > TafelTree view javascript > tafelTree/doc/docOffline_fr.html
<html>
<head>
	<style>
	body, table, select, option, input, textarea {
	font-family: Verdana, Arial, sans-serif;
	}

	body {
	margin-top: 50px;
	text-align: center;
	background-color: #FFFFFF;
	padding-bottom: 30px;
	}

	div.body {
	text-align: left;
	width: 850px;
	font-size: 0.7em;
	margin: 0 auto;
	}

	h1 {
	text-align: right;
	font-size: 2em;
	color: #333399;
	margin: 0;
	padding: 0.1em;
	}

	h2 {
	text-align: right;
	font-size: 1.5em;
	color: #9999FF;
	margin: 0;
	padding: 0.2em;
	padding-bottom: 1em;
	border-bottom: 1px solid #999999;
	}

	h1 span {
	font-size: 0.5em;
	font-style: italic;
	}

	img.titre {
	float: left;
	}

	.spacer {
	clear: both;
	}

	a:visited {
	color: #9999FF;
	}

	a:hover {
	color: #009900;
	}

	/**
	 * Le menu
	 */
	#menu {
	list-style: none;
	margin: 0;
	padding: 0;
	font-weight: bold;
	font-size: 1.2em;
	}

	#menu li {
	float: left;
	width: 16.64%;
	background-color: #EEEEFF;
	}

	#menu a {
	display: block;
	text-align: center;
	text-decoration: none;
	border-bottom: 1px solid #999999;
	}

	#menu a:visited {
	color: #0000FF;
	}

	#menu .ici a {
	color: #009900;
	}

	#menu a:hover {
	background-color: #CCCCFF;
	color: #EEEEFF;
	}

	#contenu {
	clear: both;
	}

	#contenu .gauche {
	font-size: 1.1em;
	text-align: justify;
	margin-top: 1em;
	}

	/**
	 * Le contenu de gauche
	 */
	#contenu code {
	display: block;
	padding: 0.2em;
	background-color: #EEEEEE;
	border: 1px solid #999999;
	margin: 1em 0;
	font-size: 1em;
	}

	#contenu .gauche > code {
	font-size: 1.3em;
	}

	#contenu .gauche h4 {
	border-bottom: 1px solid #CCCCCC;
	font-size: 1em;
	color: #999999;
	margin-top: 2em;
	margin-bottom: 0;
	}

	#contenu h3 {
	text-align: center;
	margin: 0;
	font-size: 1.2em;
	padding-bottom: 55px;
	}

	/**
	 * Le bas du site
	 */
	div.bottom {
	clear: both;
	border-top: 1px solid #CCCCCC;
	color: #555555;
	margin-top: 1em;
	padding-right: 25px;
	background: url('../imgs/fleche.jpg') right center no-repeat;
	}

	div.bottom p {
	text-align: right;
	margin: 0;
	padding: 0;
	}

	.classe {
	color: #009900;
	}

	.var {
	color: #000099;
	}

	.err {
	color: #990000;
	}

	.defaut {
	font-weight: bold;
	color: #990000;
	}

	em {
	color: inherit;
	}

	.develop {
	margin-left: 5em;
	display: none;
	}

	.doc h4 {
	cursor: pointer;
	}

	#contenu .gauche .doc h4:hover {
	color: #009900;
	}


	div.code {
	border: 1px solid #999999;
	margin-bottom: 1em;
	}

	div.code table {
	border-collapse: collapse;
	font-family: monospace;
	}

	div.code td {
	vertical-align: top;
	}

	div.code td.num {
	background-color: #EEEEEE;
	border-right: 1px solid #DDDDDD;
	}

	div.code td th {
	font-size: 11px;
	text-align: right;
	font-weight: normal;
	background-color: #EEEEEE;
	color: #777777;
	width: 2em;
	}

	div.code td td {
	font-size: 13px;
	padding: 0 0 0 0.5em;
	}

	div.code span.reserved {
	color: #0000FF;
	}

	div.code span.string {
	color: #CC0000;
	}

	div.code span.object {
	color: #660000;
	}

	div.code span.php {
	font-weight: bold;
	color: #CC33CC;
	}

	div.code span.comment, span.comment span.reserved, span.comment span.object, span.comment span.string {
	color: #009900;
	}

	.doc h1 {
	text-align: left;
	margin-top: 1em;
	}
	.doc h2 {
	text-align: left;
	margin-top: 0.5em;
	}

	#contenu .gauche h4.new {
	color: #CC5555;
	background-image: url('../imgs/new.png');
	background-position: top right;
	background-repeat: no-repeat;
	}

	.doc table.prop {
	margin-left: 5%;
	font-size: 0.9em;
	border-collapse: collapse;
	width: 95%;
	}

	.doc table.prop th {
	text-align: left;
	}
	.doc table.prop th.long {
	width: 30%;
	}

	.doc table.prop tr:hover {
	background-color: #EEEEEE;
	}
	</style>
	<script type="text/javascript">
		function shownext(obj) {
			var div = obj;
			while (div && div.nodeName.toLowerCase() != 'div') {
				div = div.nextSibling;
			}
			if (div.style.display == 'block') {
				div.style.display = 'none';
			} else {
				div.style.display = 'block';
			}
		}
	</script>
</head>
<body>

<div class="body">
	<div id="contenu">
		<div class="gauche" >

			<h3 class="m4">Documentation</h3>

			<h4>Documentation offline</h4>
			<ul>
				<li><a href="docOffline.html" target="_blank">Voir la documentation offline (HTML)</a></li>
				<li><a href="docOffline.zip">Documentation offline (ZIP, décompressé : 270 kb)</a></li>
			</ul>
			<h4>Format HTML</h4>
			<p>TafelTree est un arbre Javascript open source qui permet de faire énormément de choses, ou presque.
			Il est basé sur JSON et DOM, notamment. La structure HTML, complètement transparente (l'utilisateur touille 
			tout via du javascript, bien entendu) est comme ceci :</p>

			<div id="myTree"></div>
			<div class="spacer">&nbsp;</div>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr><tr><th>31</th></tr><tr><th>32</th></tr><tr><th>33</th></tr><tr><th>34</th></tr><tr><th>35</th></tr><tr><th>36</th></tr><tr><th>37</th></tr><tr><th>38</th></tr><tr><th>39</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;div id=<span class="string">"tree"</span> class="tafelTree"></p></td></tr><tr><td><p style="padding-left:4ex;">&lt;div class="tafelTree_root"></p></td></tr><tr><td><p style="padding-left:8ex;">&lt;table>&lt;tbody>&lt;tr></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;td>&lt;img class="openable<span class="string">" src="</span>../imgs/minus5.gif"/>&lt;/td></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;td>&lt;img src=<span class="string">"../imgs/globe.gif"</span>/>&lt;/td></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;td class="canevas<span class="string">">&lt;div class="</span>content">Racine&lt;/div>&lt;/td></p></td></tr><tr><td><p style="padding-left:8ex;">&lt;/tr>&lt;/tbody>&lt;/table></p></td></tr><tr><td><p style="padding-left:8ex;">&lt;div class="tafelTree_branch"></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;table>&lt;tbody>&lt;tr></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;td>&lt;img src=<span class="string">"../imgs/empty.gif"</span>/>&lt;/td></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;td>&lt;img class="openable<span class="string">" src="</span>../imgs/line3.gif"/>&lt;/td></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;td>&lt;img src=<span class="string">"../imgs/page.gif"</span>/>&lt;/td></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;td class="canevas<span class="string">">&lt;div class="</span>content"></p></td></tr><tr><td><p style="padding-left:20ex;">Enfant 1&lt;/div>&lt;/td></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;/tr>&lt;/tbody>&lt;/table></p></td></tr><tr><td><p style="padding-left:8ex;">&lt;/div></p></td></tr><tr><td><p style="padding-left:8ex;">&lt;div class="tafelTree_branch"></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;table>&lt;tbody>&lt;tr></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;td>&lt;img src=<span class="string">"../imgs/empty.gif"</span>/>&lt;/td></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;td>&lt;img class="openable<span class="string">" src="</span>../imgs/minus2.gif"/>&lt;/td></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;td>&lt;img src=<span class="string">"../imgs/folderopen.gif"</span>/>&lt;/td></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;td class="canevas<span class="string">">&lt;div class="</span>content"></p></td></tr><tr><td><p style="padding-left:20ex;">Enfant 2&lt;/div>&lt;/td></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;/tr>&lt;/tbody>&lt;/table></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;div class="tafelTree_branch"></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;table>&lt;tbody>&lt;tr></p></td></tr><tr><td><p style="padding-left:20ex;">&lt;td>&lt;img src=<span class="string">"../imgs/empty.gif"</span>/>&lt;/td></p></td></tr><tr><td><p style="padding-left:20ex;">&lt;td>&lt;img src=<span class="string">"../imgs/empty.gif"</span>/>&lt;/td></p></td></tr><tr><td><p style="padding-left:20ex;">&lt;td>&lt;img class="openable"</p></td></tr><tr><td><p style="padding-left:24ex;">src=<span class="string">"../imgs/line2.gif"</span>/>&lt;/td></p></td></tr><tr><td><p style="padding-left:20ex;">&lt;td>&lt;img src=<span class="string">"../imgs/page.gif"</span>/>&lt;/td></p></td></tr><tr><td><p style="padding-left:20ex;">&lt;td class="canevas<span class="string">">&lt;div class="</span>content"></p></td></tr><tr><td><p style="padding-left:24ex;">Enfant avec enfant&lt;/div>&lt;/td></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;/tr>&lt;/tbody>&lt;/table></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;/div></p></td></tr><tr><td><p style="padding-left:8ex;">&lt;/div></p></td></tr><tr><td><p style="padding-left:4ex;">&lt;/div></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/div></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<div class="doc">
			<h1>Propriétés TafelTreeBranch de structure</h1>
			<h2>Propriétés TafelTreeBranch basiques</h2>
			
			<a name="tag"></a>
			<h4 onclick="shownext(this)">id <em>(string)</em></h4>
			<div class="develop">
				<p class="classe">Obligatoire</p>

				<p>L'id utilisateur de la branche. Doit être unique. Attention, donc, lors de drag'n drop entre deux arbres, de bien vérifier que le tag de l'élément dropé n'existe pas encore.</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="txt"></a>
			<h4 onclick="shownext(this)">txt <em>(string)</em></h4>
			<div class="develop">
				<p class="classe">Obligatoire</p>
				<p>Le texte affiché à coté de l'icône</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="acceptdrop"></a>
			<h4 onclick="shownext(this)">acceptdrop <em>(boolean)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : true</p>
				<p><strong>True</strong> pour pouvoir droper des éléments sur la branche, <strong>false</strong> pour rendre cette action impossible.</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"acceptdrop"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Tacceptdrop=<span class="string">"1"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="canhavechildren"></a>
			<h4 onclick="shownext(this)">canhavechildren <em>(boolean)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : false</p>
				<p>Mettre <strong>true</strong> pour dire que la branche peut avoir des enfants. Est nécessaire lorsqu'on utilise la fonction <strong><a href="#onopenpopulate">onopenpopulate()</a></strong>. Cela permet de faire apparaître le " + " pour ouvrir la branche alors qu'elle n'a pas encore d'enfants.</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"canhavechildren"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Tcanhavechildren=<span class="string">"1"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="check"></a>
			<h4 onclick="shownext(this)">check <em>(integer)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : 0</p>
				<p>Mettre <strong>1</strong> pour que la branche soit chechée d'office, s'il y a les checkboxes activées</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"check"</span> : 1</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Tcheck=<span class="string">"1"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="draggable"></a>
			<h4 onclick="shownext(this)">draggable <em>(boolean)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : true</p>
				<p><strong>True</strong> pour pouvoir dragger la branche, <strong>false</strong> pour rendre cette action impossible. N'a aucun effet s'il n'y a pas de fonction setOnDrop() ou setOnDropAjax() définie. (ou encore ondrop ou ondropajax)</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"draggable"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Tdraggable=<span class="string">"1"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="editable"></a>
			<h4 onclick="shownext(this)">editable <em>(boolean)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : 1</p>
				<p>Indique si la branche peut être éditée ou non. Si la fonciton onEdit() existe, mettre ce paramètre à false permet d'empêcher l'édition malgré tout</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"editable"</span> : <span class="reserved">false</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Teditable=<span class="string">"0"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="img"></a>
			<h4 onclick="shownext(this)">img <em>(string)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : pas d'image</p>
				<p>L'icône affiché lorsque la branche n'a pas d'enfants.</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"img"</span> : <span class="string">"anImg.gif"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"imgopen"</span> : <span class="string">"anImg.gif"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"imgclose"</span> : <span class="string">"anImg.gif"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Timg=<span class="string">"anImg.gif"</span> Timgopen=<span class="string">"anImg.gif"</span> Timgclose=<span class="string">"anImg.gif"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="imgclose"></a>
			<h4 onclick="shownext(this)">imgclose <em>(string)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : le même que <a href="#img">img</a></p>
				<p>L'icône affiché lorsque la branche a des enfants et est fermée.</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"img"</span> : <span class="string">"anImg.gif"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"imgopen"</span> : <span class="string">"anImg.gif"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"imgclose"</span> : <span class="string">"anImg.gif"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Timg=<span class="string">"anImg.gif"</span> Timgopen=<span class="string">"anImg.gif"</span> Timgclose=<span class="string">"anImg.gif"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="imgopen"></a>
			<h4 onclick="shownext(this)">imgopen <em>(string)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : le même que <a href="#img">img</a></p>
				<p>L'icône affiché lorsque la branche a des enfants et est ouverte.</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"img"</span> : <span class="string">"anImg.gif"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"imgopen"</span> : <span class="string">"anImg.gif"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"imgclose"</span> : <span class="string">"anImg.gif"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Timg=<span class="string">"anImg.gif"</span> Timgopen=<span class="string">"anImg.gif"</span> Timgclose=<span class="string">"anImg.gif"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="img"></a>
			<h4 class="new" onclick="shownext(this)">imgselected <em>(string)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : le même que <a href="#img">img</a></p>
				<p>L'icône affiché lorsque la branche n'a pas d'enfants et est sélectionnée.</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"imgselected"</span> : <span class="string">"anImgSelect.gif"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"img"</span> : <span class="string">"anImg.gif"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Timg=<span class="string">"anImg.gif"</span> Timgselected=<span class="string">"anImgSelect.gif"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="imgclose"></a>
			<h4 class="new" onclick="shownext(this)">imgcloseselected <em>(string)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : le même que <a href="#img">imgclose</a></p>
				<p>L'icône affiché lorsque la branche a des enfants et est fermée et sélectionnée.</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"imgcloseselected"</span> : <span class="string">"anImgSelect.gif"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"imgclose"</span> : <span class="string">"anImg.gif"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Timgcloseselected=<span class="string">"anImgSelect.gif"</span> Timgclose=<span class="string">"anImg.gif"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="imgopen"></a>
			<h4 class="new" onclick="shownext(this)">imgopenselected <em>(string)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : le même que <a href="#img">imgopen</a></p>
				<p>L'icône affiché lorsque la branche a des enfants et est ouverte et sélectionnée.</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"imgopenselected"</span> : <span class="string">"anImgSelect.gif"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"imgopen"</span> : <span class="string">"anImg.gif"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Timgopen=<span class="string">"anImg.gif"</span> Timgopenselected=<span class="string">"anImgSelect.gif"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="items"></a>
			<h4 onclick="shownext(this)">items <em>(array)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel</p>
				<p>Un tableau composé de branches. Représente les enfants de la branche</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr><tr><th>31</th></tr><tr><th>32</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"items"</span> : [</p></td></tr><tr><td><p style="padding-left:4ex;">{</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"id"</span> : <span class="string">"child1"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"txt"</span> : <span class="string">"Child 1"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"items"</span> : [</p></td></tr><tr><td><p style="padding-left:8ex;">{</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">"id"</span> : <span class="string">"child1_1"</span>,</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">"txt"</span> : <span class="string">"Child of child 1"</span></p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:8ex;">]</p></td></tr><tr><td><p style="padding-left:4ex;">}, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"id"</span> : <span class="string">"child2"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"txt"</span> : <span class="string">"Child 2"</span></p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">]</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span>>My super text</p></td></tr><tr><td><p style="padding-left:4ex;">&lt;ul></p></td></tr><tr><td><p style="padding-left:8ex;">&lt;li id=<span class="string">"child1"</span>>Child 1</p></td></tr><tr><td><p style="padding-left:12ex;">&lt;ul></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;li id=<span class="string">"child1_1"</span>>Child of child 1&lt;/li></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;/ul></p></td></tr><tr><td><p style="padding-left:8ex;">&lt;/li></p></td></tr><tr><td><p style="padding-left:8ex;">&lt;li id=<span class="string">"child2"</span>>Child 2&lt;/li></p></td></tr><tr><td><p style="padding-left:4ex;">&lt;/ul></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="last"></a>
			<h4 onclick="shownext(this)">last <em>(boolean)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut : false</p>
				<p><strong>True</strong> pour toujours avoir la branche en dernière position dans l'arbre. Utilisé après le drop d'une branche, pour éviter que cette dernière ne se retrouve tout en bas.</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"Trash"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"img"</span> : <span class="string">"trash.gif"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"last"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Tlast=<span class="string">"1"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="open"></a>
			<h4 onclick="shownext(this)">open <em>(boolean)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel. Par défaut, elle prend la valeur de l'arbre (<a href="#setOpenAll">setOpenAll()</a>). Si la gestion des cookies est activée, celle-ci passe par-dessus tout.</p>
				<p><strong>True</strong> pour avoir la branche ouverte, <strong>false</strong> pour l'avoir fermée.</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"open"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Topen=<span class="string">"1"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="style"></a>
			<h4 onclick="shownext(this)">style <em>(string)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel</p>
				<p>Le nom d'une classe CSS qui s'appliquera uniquement au texte</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"style"</span> : <span class="string">"aCSSclassName"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Tstyle=<span class="string">"aCCSclassName"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="title"></a>
			<h4 onclick="shownext(this)">title <em>(string)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel</p>
				<p>Le contenu de l'attribut HTML "title" du texte de la branche (équivalent au tooltip). Le title ne peut contenir que du texte.</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"title"</span> : <span class="string">"My title"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Ttitle=<span class="string">"My title"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>
			
			<a name="style"></a>
			<h4 onclick="shownext(this)">tooltip <em>(string)</em></h4>
			<div class="develop">
				<p class="classe">Optionnel</p>
				<p>Un tooltip qui s'affiche au survol de la branche avec la souris (équivalent au title). Le contenu peut être de l'HTML</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"myId"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"My super text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"tooltip"</span> : <span class="string">"Mon joli tooltip"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// UL - LI</span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;li id=<span class="string">"myId"</span> Ttooltip=<span class="string">"Mon joli tooltip"</span>>My super text&lt;/li></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

				<h4>Notes</h4>
				<ul>
					<li>On peut y mettre de l'HTML. Attention toutefois avec les quotes ( ' ) et guillemets ( " )</li>
					<li>Le tooltip est automatiquement inséré dans un DIV</li>
					<li>Le style CSS s'appelle <strong>div.tooltip</strong></li>
				</ul>

			</div>


			<h2>Propriétés TafelTreeBranch de fonctions</h2>

			<a name="onbeforecheck"></a>
			<h4 onclick="shownext(this)">onbeforecheck <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>

				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>
						<td>la branche qui va changer son status de check</td></tr>
					<tr><th>checked <em>(boolean)</em></th>
						<td>Le status de la branche si le changement est validé</td></tr>
				</table>

				<p class="var">Optionnel</p>
				<p>Méthode appelée lorsqu'on clique sur une checkbox, avant que le changement de status soit fait</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myBeforeCheck (branch, checked) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getId());</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">return</span> <span class="reserved">true</span>;</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onbeforecheck"</span> : myBeforeCheck</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="onbeforeopen"></a>
			<h4 onclick="shownext(this)">onbeforeopen <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>

						<td>la branche qui va s'ouvrir</td></tr>
					<tr><th>opened <em>(boolean)</em></th>
						<td>A true, la branche est ouverte et va donc se fermer. A false, c'est l'inverse</td></tr>
				</table>
				<p class="var">Optionnel</p>
				<p>Méthode appelée juste avant d'ouvrir la branche. <strong>Elle doit retourner un boolean</strong>. Prend le pas sur la méthode <strong><a href="#setOnBeforeOpen">setOnBeforeOpen()</a></strong> de TafelTree</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myBeforeOpen (branch, opened) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Tests divers</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (resultsFromTest) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// OK, la branche va s'ouvrir</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> <span class="reserved">true</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// Ici, la branche ne s'ouvrira pas. La fonciton myOpen ne sera</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// pas appelée</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> <span class="reserved">false</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myOpen (branch, opened) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getTag());</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onbeforeopen"</span> : myBeforeOpen,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onopen"</span> : myOpen</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="oncheck"></a>
			<h4 onclick="shownext(this)">oncheck <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>

						<td>la branche qui a changé son status de check</td></tr>
					<tr><th>checked <em>(boolean)</em></th>
						<td>Le nouveau status de la branche</td></tr>
				</table>
				<p class="var">Optionnel</p>
				<p>Méthode appelée lorsqu'on clique sur une checkbox</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myCheck (branch, checked) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"oncheck"</span> : myCheck</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="onclick"></a>
			<h4 onclick="shownext(this)">onclick <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>

						<td>la branche sur laquelle on clique</td></tr>
				</table>
				<p class="var">Optionnel</p>
				<p>Méthode appelée lorsqu'on clique sur le texte de la branche. Prend le pas sur la méthode <strong><a href="#setOnClick">setOnClick()</a></strong> de TafelTree</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myClick (branch) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch click"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onclick"</span> : myClick</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="ondblclick"></a>
			<h4 onclick="shownext(this)">ondblclick <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>

						<td>la branche sur laquelle on double-clique</td></tr>
				</table>
				<p class="var">Optionnel</p>
				<p>Méthode appelée lorsqu'on double-clique sur le texte de la branche. Prend le pas sur la méthode <strong><a href="#setOnDblClick">setOnDblClick()</a></strong> de TafelTree</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myDblClick (branch) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch double-click"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"ondblclick"</span> : myDblClick</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="ondrop"></a>
			<h4 class="new" onclick="shownext(this)">ondrop <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch_move <em>(TafelTreeBranch)</em></th>

						<td>la branche dragguée</td></tr>
					<tr><th>branch_here <em>(TafelTreeBranch)</em></th>
						<td>La branche sur qui il y a eu le drop</td></tr>
					<tr><th>drop_finished <em>(boolean)</em></th>
						<td>False si le drop n'est pas encore effectué, True si le drop est effectué</td></tr>

					<tr><th>new_branch <em>(boolean)</em></th>
						<td>La branche insérée, s'il s'agit d'un copyDrag</td></tr>
				</table>
				<p class="var">Optionnel</p>
				<p>Méthode appelée après avoir drag'n dropé la branche. <strong>Elle doit retourner un boolean</strong>. On peut faire un "drop as sibling (frère)" en gardant la touche <strong>ALT</strong> appuyée. Il est également possible de faire un "copydrag" en
				maintenant la touche <strong>CONTROL</strong> appuyée. Prend le pas sur la méthode <strong><a href="#setOnDrop">setOnDrop()</a></strong> de TafelTree</p>

				<p>La méthode est appelée deux fois. Une fois avant que le drop soit fait (drop_finished = false) et une fois après que le drop soit fait (drop_finished = true), pour autant qu'il n'y ait pas eu d'erreurs avant.</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myDrop (branch_move, branch_here, drop_finished,</p></td></tr><tr><td><p style="padding-left:4ex;">new_branch) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Attention, cette fonction est appelée 2x. D'abord avant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// que le drop soit fait, puis ensuite après coup. Là, on</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// teste si le drop n'a pas encore été effectué</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (!drop_finished) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// Tests divers</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">if</span> (resultsFromTest) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="comment">// OK, la branche pourra être droppée ici</span></p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">return</span> <span class="reserved">true</span>;</p></td></tr><tr><td><p style="padding-left:8ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="comment">// Ici, la branche ne sera pas droppée et reviendra</span></p></td></tr><tr><td><p style="padding-left:12ex;"><span class="comment">// à sa place initiale</span></p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">return</span> <span class="reserved">false</span>;</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// On peut récupérer la nouvelle branche insérée</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// s<span class="string">'il s'</span>agit d'un copyDrag</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">if</span> (new_branch) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(new_branch.getId())</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"ondrop"</span> : myDrop</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

				<h4>Notes</h4>
				<ul>
					<li>Maintenir ALT pour dropper "as sibling"</li>
					<li>Maintenir CONTROL pour faire un "copydrag"</li>
				</ul>
			</div>

			<a name="onedit"></a>

			<h4 onclick="shownext(this)">onedit <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>
						<td>la branche qui a été éditée</td></tr>

					<tr><th>newValue <em>(string)</em></th>
						<td>La nouvelle valeur qui sera enregistrée</td></tr>
					<tr><th>oldValue <em>(string)</em></th>
						<td>L'ancienne valeur de la branche</td></tr>
				</table>
				<p class="var">Optionnel</p>

				<p>Méthode appelée lorsqu'on édite une branche (précisément, après le blur() de l'input qui apparaît suite à un double-clic sur la branche)</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myEdit (branch, newValue, oldValue) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (newValue.toLowerCase() == <span class="string">"trop facile"</span>) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> <span class="string">"Vraiment trop facile"</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> newValue;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"To be edited..."</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onedit"</span> : myEdit</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

				<h4>Notes</h4>
				<ul>
					<li>Retourne la string qui sera effectivement enregistrée</li>
				</ul>
			</div>

			<a name="onmouseout"></a>
			<h4 onclick="shownext(this)">onmouseout <em>(function)</em></h4>

			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>
						<td>la branche que la souris quitte</td></tr>
				</table>
				<p class="var">Optionnel</p>

				<p>Méthode appelée lorsqu'on retire la souris du texte de la branche. Prend le pas sur la méthode <strong><a href="#setOnMouseOut">setOnMouseOut()</a></strong> de TafelTree</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myMouseOut (branch) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(<span class="string">"out : "</span> + branch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myMouseOver (branch) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(<span class="string">"over : "</span> + branch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch mouse over and out"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onmouseover"</span> : myMouseOver,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onmouseout"</span> : myMouseOut</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="onmouseover"></a>
			<h4 onclick="shownext(this)">onmouseover <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>

						<td>la branche sur qui la souris passe</td></tr>
				</table>
				<p class="var">Optionnel</p>
				<p>Méthode appelée lorsqu'on passe la souris sur le texte de la branche. Prend le pas sur la méthode <strong><a href="#setOnMouseOver">setOnMouseOver()</a></strong> de TafelTree</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myMouseOut (branch) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(<span class="string">"out : "</span> + branch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myMouseOver (branch) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(<span class="string">"over : "</span> + branch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch mouse over and out"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onmouseover"</span> : myMouseOver,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onmouseout"</span> : myMouseOut</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="onmousedown"></a>
			<h4 class="new" onclick="shownext(this)">onmousedown <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>

						<td>la branche sur qui la souris passe</td></tr>
				</table>
				<p class="var">Optionnel</p>
				<p>Méthode appelée lorsqu'on fait un mouse down sur la branche. Prend le pas sur la méthode <strong><a href="#setOnMouseDown">setOnMouseDown()</a></strong> de TafelTree</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myMouseDown (branch) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(<span class="string">"down : "</span> + branch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch mouse down"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onmousedown"</span> : myMouseDown</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="onmouseup"></a>
			<h4 class="new" onclick="shownext(this)">onmouseup <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>

						<td>la branche sur qui la souris passe</td></tr>
				</table>
				<p class="var">Optionnel</p>
				<p>Méthode appelée lorsqu'on fait un mouse up sur la branche. Prend le pas sur la méthode <strong><a href="#setOnMouseUp">setOnMouseUp()</a></strong> de TafelTree</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myMouseUp (branch) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(<span class="string">"up : "</span> + branch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch mouse up"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onmouseup"</span> : myMouseUp</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="onopen"></a>
			<h4 onclick="shownext(this)">onopen <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>

						<td>la branche qui s'ouvre ou ferme</td></tr>
					<tr><th>opened <em>(boolean)</em></th>
						<td>A true, la branche est ouverte, à false non</td></tr>
				</table>
				<p class="var">Optionnel</p>
				<p>Méthode appelée après l'ouverture de la branche. Prend le pas sur la méthode <strong><a href="#setOnOpen">setOnOpen()</a></strong> de TafelTree</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myBeforeOpen (branch, opened) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Tests divers</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (resultsFromTest) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// OK, la branche va s'ouvrir</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> <span class="reserved">true</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// Ici, la branche ne s'ouvrira pas. La fonciton myOpen ne sera</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// pas appelée</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> <span class="reserved">false</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myOpen (branch, opened) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getTag());</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onbeforeopen"</span> : myBeforeOpen,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onopen"</span> : myOpen</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>


			<h2>Spécificités</h2>

			<h4 class="new" onclick="shownext(this)">onerrorajax(function)</h4>
			<div class="develop">
				<h4>Paramètres</h4>
				<table class="prop">

					<tr><th>type <em>(string)</em></th>
						<td>Le type d'erreur (open, drop ou edit)</td></tr>
					<tr><th>response <em>(string)</em></th>
						<td>La réponse texte Ajax</td></tr>
					<tr><th>branch <em>(TafelTreeBranch)</em></th>

						<td>La branche courante</td></tr>
					<tr><th>droppedOn <em>(TafelTreeBranch)</em></th>
						<td>La branche sur laquelle il y a eu un drop (s'il s'agit d'un drop, évidemment)</td></tr>
				</table>
				<p>Méthode appelée suite à une erreur dans une requête Ajax de drop, open ou edit</p>
				<h4>Exemples</h4>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myErrorAjax (type, response, branch, droppedOn) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Vérifie le type d'erreur. Peut être drop, edit ou open</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">switch</span> (type) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">case</span> <span class="string">"drop"</span> :</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(<span class="string">"Une erreur est survenue pendant le drop"</span>);</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">break</span>;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">case</span> <span class="string">"open"</span> :</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">break</span>;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">case</span> <span class="string">"edit"</span> :</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">break</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"ondropajax"</span> : myDrop,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"droplink"</span> : <span class="string">"page.php"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onerrorajax"</span> : myErrorAjax</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="openlink"></a>
			<h4 onclick="shownext(this)">openlink <em>(string)</em></h4>
			<div class="develop">
				<p class="err">Optionnel, mais obligatoire si <strong>onopenpopulate</strong> est une fonction. Uitlisé avec la propriété de branche <strong><a href="#canhavechildren">canhavechildren</a></strong></p>

				<p>Page de script coté serveur appelée après l'ouverture de la branche, s'il s'agit de la fonction <strong>onopenpopulate</strong>. Prend le pas sur la méthode <strong><a href="#setOnOpenPopulate">setOnOpenPopulate()</a></strong> de TafelTree</p>
			</div>

			<a name="onopenpopulate"></a>
			<h4 onclick="shownext(this)">onopenpopulate <em>(function)</em></h4>

			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>
						<td>la branche ouverte</td></tr>
					<tr><th>response <em>(string)</em></th>

						<td>La string retournée par la requête</td></tr>
				</table>
				<p class="err">Optionnel</p>
				<p>Méthode appelée après l'ouverture de la branche. Lorsque celle-ci est ouverte, elle lance une requête Ajax à la page <strong>openlink</strong> et renvoie le retour Ajax à la méthode utilisateur. <strong>La méthode doit retourner une string JSON représentant des TafelTreeBranch</strong>. Prend le pas sur la méthode <strong><a href="#setOnOpenPopulate">setOnOpenPopulate()</a></strong> de TafelTree</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr><tr><th>31</th></tr><tr><th>32</th></tr><tr><th>33</th></tr><tr><th>34</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myOpenPopulate (branch, response) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Pour voir le contenu de la réponse, on peut faire une</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"<span class="reserved">alert</span>"</span> ou le mettre dans le DIV de debug de l'arbre</span></p></td></tr><tr><td><p style="padding-left:4ex;">branch.tree.debug(response);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On peut aussi évaluer la réponse en tant qu'objet JSON</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// (à noter qu<span class="string">'il s'</span>agit d'un tableau). La réponse DOIT</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// ETRE une description d'une ou plusieurs TafelTreeBranch</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// [{</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"id"</span> : <span class="string">"id_from_server_1"</span>,</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"txt"</span> : <span class="string">"This is one is from the server"</span>,</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"img"</span> : <span class="string">"globe.gif"</span></span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// }]</span></p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Tests divers</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (resultsFromTest) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// OK, la branche sera ouverte avec les nouvelles</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// branches qui viennent du serveur</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> response;</p></td></tr><tr><td><p style="padding-left:4ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// Ici, la branche ne sera pas ouverte et aucune</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// branche ne sera ajoutée</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> <span class="reserved">false</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onopenpopulate"</span> : myOpenPopulate,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"openlink"</span> : <span class="string">"somewhere/serverScriptPage.php"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"canhavechildren"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

				<h4>Notes</h4>
				<ul>
					<li>Le réponse DOIT ETRE un tableau JSON ( <strong>[ ]</strong> ) contenant des TafelTreeBranch</li>
					<li>Le JSON DOIT ETRE une description de une ou plusieurs TafelTreeBranch</li>
					<li>Les variables envoyées à la page <a href="#openlink">openlink</a> passent par la méthode POST</li>

					<li>Ces variables sont :
						<ul>
							<li>" branch " = description JSON de la branche</li>
							<li>" branch_id " = id de la branche qui s'ouvre</li>
							<li>" tree_id " = id de l'arbre d'où est tiré la branche qui s'ouvre</li>
						</ul>
					</li>
					<li>Toutes autres variables passée par <a href="#openlink">openlink</a> sont également transmises en POST. Par exemple, si openlink = "page.php?spec=1", on récuperera <em>spec</em> en POST malgré tout.</li>

				</ul>
			</div>

			<a name="editlink"></a>
			<h4 onclick="shownext(this)">editlink <em>(string)</em></h4>
			<div class="develop">
				<p class="err">Optionnel, mais obligatoire si <strong>oneditajax</strong> est une fonction. Peut être utilisé avec la propriété de branche <strong><a href="#editable">editable</a></strong></p>

				<p>Page de script coté serveur appelée après l'édition de la branche, s'il s'agit de la fonction <strong>oneditajax</strong>. Prend le pas sur la méthode <strong><a href="#setOnEditAjax">setOnEditAjax()</a></strong> de TafelTree</p>
			</div>

			<a name="oneditajax"></a>
			<h4 onclick="shownext(this)">oneditajax <em>(function)</em></h4>

			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch <em>(TafelTreeBranch)</em></th>
						<td>la branche ouverte</td></tr>
					<tr><th>response <em>(string)</em></th>

						<td>La string retournée par la requête</td></tr>
					<tr><th>oldValue <em>(string)</em></th>
						<td>L'ancienne valeur de la branche</td></tr>
				</table>
				<p class="err">Optionnel</p>
				<p>Méthode appelée après l'édition de la branche. Lorsque celle-ci a terminé d'être éditée, elle lance une requête Ajax à la page <strong>editlink</strong> et renvoie le retour Ajax à la méthode utilisateur. <strong>La méthode doit retourner une string représentant la nouvelle valeur de la branche</strong>. Prend le pas sur la méthode <strong><a href="#setOnEditAjax">setOnEditAjax()</a></strong> de TafelTree</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr><tr><th>31</th></tr><tr><th>32</th></tr><tr><th>33</th></tr><tr><th>34</th></tr><tr><th>35</th></tr><tr><th>36</th></tr><tr><th>37</th></tr><tr><th>38</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myEditAjax (branch, response, oldValue) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Pour voir le contenu de la réponse, on peut faire une</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"<span class="reserved">alert</span>"</span> ou le mettre dans le DIV de debug de l'arbre</span></p></td></tr><tr><td><p style="padding-left:4ex;">branch.tree.debug(response);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On peut aussi évaluer la réponse en tant qu'objet JSON</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// (à noter qu'elle est entre parenthèses). La réponse</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// doit contenir, d<span class="string">'une manière ou d'</span>une autre, la</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// nouvelle valeur de la branche</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// ({</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"message"</span> : <span class="string">"Tout est ok sur le serveur"</span>,</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"newValue"</span> : <span class="string">"Nouvelle valeur de la branche"</span>,</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"anyOtherParams"</span> : <span class="reserved">true</span></span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// })</span></p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On peut aussi retourner seulement la nouvelle valeur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// (dans ce cas, plus besoin de parenthèses)</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="reserved">alert</span> (response); // show the <span class="reserved">new</span> text</span></p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Tests divers</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (resultsFromTest) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// OK, la branche sera éditée et aura la</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// nouvelle valeur retournée par cette fonction</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> theNewValue;</p></td></tr><tr><td><p style="padding-left:4ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// Ici, la branche ne sera pas éditée et conservera</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// son ancienne valeur (oldValue)</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> <span class="reserved">false</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"oneditajax"</span> : myEditAjax,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"editlink"</span> : <span class="string">"somewhere/serverScriptPage.php"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

				<h4>Notes</h4>
				<ul>
					<li>La réponse devrait contenir la nouvelle valeur à insérer dans la branche</li>
					<li>Les variables envoyées à la page <a href="#editlink">editlink</a> passent par la méthode POST</li>
					<li>Ces variables sont :
						<ul>

							<li>" branch " = description JSON de la branche</li>
							<li>" branch_id " = id de la branche qui s'ouvreé</li>
							<li>" tree_id " = id de l'arbre d'où est tiré la branche qui s'ouvre</li>
							<li>" new_value " = la nouvelle valeur de la branche</li>
							<li>" old_value " = l'ancienne valeur de la branche</li>
						</ul>

					</li>
					<li>Toutes autres variables passée par <a href="#editlink">editlink</a> sont également transmises en POST. Par exemple, si editlink = "page.php?spec=1", on récuperera <em>spec</em> en POST malgré tout.</li>
				</ul>
			</div>

			<a name="droplink"></a>

			<h4 onclick="shownext(this)">droplink <em>(string)</em></h4>
			<div class="develop">
				<p class="err">Optionnel, mais obligatoire si <strong>ondropajax</strong> est une fonction</p>
				<p>Page de script coté serveur appelée après le drop de la branche, s'il s'agit de la fonction <strong>ondropajax</strong>. Prend le pas sur la méthode <strong><a href="#setOnDropAjax">setOnDropAjax()</a></strong> de TafelTree</p>

			</div>

			<a name="ondropajax"></a>
			<h4 class="new" onclick="shownext(this)">ondropajax <em>(function)</em></h4>
			<div class="develop">
				<h4>Propriétés</h4>
				<table class="prop">
					<tr><th>branch_move <em>(TafelTreeBranch)</em></th>

						<td>la branche dragguée</td></tr>
					<tr><th>branch_here <em>(TafelTreeBranch)</em></th>
						<td>La branche sur qui il y a eu le drop</td></tr>
					<tr><th>response <em>(string)</em></th>
						<td>La string retournée par la requête</td></tr>

					<tr><th>drop_finished <em>(boolean)</em></th>
						<td>False si le drop n'est pas encore effectué, True si le drop est effectué</td></tr>
					<tr><th>new_branch <em>(boolean)</em></th>
						<td>La branche insérée, s'il s'agit d'un copyDrag</td></tr>
				</table>
				<p class="err">Optionnel</p>

				<p>Méthode appelée après le drag'n drop de la branche. Lorsque celle-ci est dropée, elle lance une requête Ajax à la page <strong>droplink</strong> et renvoie le retour Ajax à la méthode utilisateur. <strong>La méthode doit retourner un boolean</strong>. On peut faire un "drop as sibling (frère)" en gardant la touche <strong>ALT</strong> appuyée. Il est également possible de faire un "copydrag" en maintenant la touche <strong>CONTROL</strong> appuyée. Prend le pas sur la méthode <strong><a href="#setOnDropAjax">setOnDropAjax()</a></strong> de TafelTree</p>

				<p>La méthode est appelée deux fois. Une fois avant que le drop soit fait (drop_finished = false) et une fois après que le drop soit fait (drop_finished = true), pour autant qu'il n'y ait pas eu d'erreurs avant.</p>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr><tr><th>31</th></tr><tr><th>32</th></tr><tr><th>33</th></tr><tr><th>34</th></tr><tr><th>35</th></tr><tr><th>36</th></tr><tr><th>37</th></tr><tr><th>38</th></tr><tr><th>39</th></tr><tr><th>40</th></tr><tr><th>41</th></tr><tr><th>42</th></tr><tr><th>43</th></tr><tr><th>44</th></tr><tr><th>45</th></tr><tr><th>46</th></tr><tr><th>47</th></tr><tr><th>48</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myDropAjax (branch_move, branch_here, response,</p></td></tr><tr><td><p style="padding-left:4ex;">drop_finished, new_branch) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On vérifie que le drop n'est pas encore effectué</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (!drop_finished) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// Pour voir le contenu de la réponse, on peut soit</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// faire une <span class="string">"<span class="reserved">alert</span>"</span>, soit la mettre dans le DIV de</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// debug</span></p></td></tr><tr><td><p style="padding-left:8ex;">branch_move.tree.debug(response);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// Evalue une réponse JSON (à noter que le JSON est</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// entre parenthèses). Imaginons que la réponse égale</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// ceci :</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// ({</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// <span class="string">"param1"</span> : <span class="reserved">true</span>,</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// <span class="string">"param2"</span> : <span class="string">"salut biscuit"</span></span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// })</span></p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// On pourra dès lors faire ceci :</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">var</span> obj = eval(response);</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">if</span> (obj.param1) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(obj.param2);</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// Tests divers</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">if</span> (resultsFromTest) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="comment">// OK, la branche sera droppée ici</span></p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">return</span> <span class="reserved">true</span>;</p></td></tr><tr><td><p style="padding-left:8ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="comment">// Ici, la branche ne sera pas droppée et</span></p></td></tr><tr><td><p style="padding-left:12ex;"><span class="comment">// retournera à sa place initiale</span></p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">return</span> <span class="reserved">false</span>;</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// On peut récupérer la nouvelle branche insérée</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// s<span class="string">'il s'</span>agit d'un copyDrag</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">if</span> (new_branch) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(new_branch.getId())</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"ondropajax"</span> : myDropAjax,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"droplink"</span> : <span class="string">"somewhere/serverScriptPage.php"</span></p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

				<h4>Notes</h4>
				<ul>
					<li>Maintenir ALT pour dropper "as sibling"</li>
					<li>Maintenir CONTROL pour faire un "copydrag"</li>
					<li>Les variables envoyées à la page <a href="#droplink">droplink</a> passent par la méthode POST</li>

					<li>Ces variables sont :
						<ul>
							<li>" drag " = description JSON de la branche qui a bougé</li>
							<li>" drop " = description JSON de la branche sur laquelle on a déposé le drag</li>
							<li>" drag_id " = id de la branche qui a bougé</li>
							<li>" drop_id " = id de la branche sur laquelle on a déposé le drag_id</li>
							<li>" treedrag_id " = id de l'arbre d'où est tiré la branche qui a bougé</li>

							<li>" treedrop_id " = id de l'arbre qui accueille la branche qui a bougé</li>
							<li>" sibling " = 0 si on le drop comme fils, 1 s'il est comme frère</li>
						</ul>
					</li>
					<li>Toutes autres variables passée par <a href="#droplink">droplink</a> sont également transmises en POST. Par exemple, si droplink = "page.php?spec=1", on récuperera <em>spec</em> en POST malgré tout.</li>

				</ul>
			</div>

			<a name="other"></a>
			<h4 onclick="shownext(this)">...mon propre paramètre <em>(integer, float, string, object, function, boolean, array)</em></h4>
			<div class="develop">
				<p>Il est possible d'ajouter autant de paramètres souhaités, suivant les besoins. Lors de l'appel d'une fonction, ils sont récupérables en passant par la propriété <strong>struct</strong>.</p>

				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myClick (branch) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (branch.struct.theWhetherIsBeautiful) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">var</span> str = branch.struct.wow;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branch.struct.aStrangeObject.param1 + <span class="string">"|"</span>+ str);</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i=0; i &lt; branch.struct.frenchNames.length; i++){</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branch.struct.frenchNames[i]);</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="reserved">var</span> branch = {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"tag1"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"A branch"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"wow"</span> : <span class="string">"some text"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"theWhetherIsBeautiful"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"aStrangeObject"</span> : {<span class="string">"param1"</span> : <span class="string">"object in object"</span>},</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"frenchNames"</span> : [</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"Albert"</span>, <span class="string">"Gilbertin"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"Zéphirin"</span>, <span class="string">"Anatole"</span>, <span class="string">"Gontan"</span></p></td></tr><tr><td><p style="padding-left:4ex;">],</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"onclick"</span> : myClick</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

				<h4>Notes</h4>
				<ul>
					<li>Les paramètres persos SONT DISPONIBLES dans la sérialisation</li>
					<li>Ils APPARAISSENT lors d'un toString()</li>
					<li>Ils NE SONT PAS INTERPRETES lors d'une création UL - LI</li>
				</ul>
			</div>


			<h1>Méthodes de TafelTreeBranch</h1>
			<h2>Méthodes publiques TafelTreeBranch</h2>

			<h4 onclick="shownext(this)">hasChildren()</h4>
			<div class="develop">
			<p>Retourne true si la branche a des enfants, false sinon</p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.hasChildren());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">isOpened()</h4>
			<div class="develop">
			<p>Retourne true si la branche est ouverte, false sinon</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.isOpened());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">isVisible()</h4>
			<div class="develop">
			<p>Retourne true si la branche est visible, false sinon</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.isVisible());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getId()</h4>
			<div class="develop">
			<p>Retourne l'identifiant (id) de la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">changeId()</h4>
			<div class="develop">
			<p>Change l'identifiant (id) de la branche. Retourne true si tout est ok, false si l'id de la branche existe déjà dans l'arbre</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (branch.changeId(<span class="string">"newId"</span>)) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(<span class="string">"Changement ok"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(<span class="string">"Cet id ("</span> + newId + <span class="string">") existe déjà"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getText()</h4>
			<div class="develop">
			<p>Retourne le contenu de la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getText());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">getParent()</h4>
			<div class="develop">
			<p>Retourne la branche parente, si elle existe</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> parent = branch.getParent();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (parent) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(parent.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">getParents()</h4>
			<div class="develop">
			<p>Retourne toutes les branches parentes. Le premier élément du tableau est le parent direct. Le dernier élément du tableau représente la racine</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> parents = branch.getParents();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; parents.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">if</span> (i &lt; parents.length - 1) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(<span class="string">"Parent : "</span> + parents[i].getId());</p></td></tr><tr><td><p style="padding-left:8ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(<span class="string">"Racine : "</span> + parents[i].getId());</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">getAncestor()</h4>
			<div class="develop">
			<p>Retourne la racine de la branche. Si on cherche l'ancêtre d'une racine, ça retournera "null"</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> root = branch.getAncestor();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (root) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(root.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getFirstBranch()</h4>
			<div class="develop">
			<p>Retourne le premier enfant de la branche, null s'il n'y en a pas</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> child = branch.getFirstBranch();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (child) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(child.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getLastBranch()</h4>
			<div class="develop">
			<p>Retourne le dernier enfant de la branche, null s'il n'y en a pas</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> child = branch.getLastBranch();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (child) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(child.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getPreviousSibling()</h4>
			<div class="develop">
			<p>Retourne la branche soeur précédente, null s'il n'y en a pas</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> sibling = branch.getPreviousSibling();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (sibling) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(sibling.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getNextSibling()</h4>
			<div class="develop">
			<p>Retourne la branche soeur suivante, null s'il n'y en a pas</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> sibling = branch.getNextSibling();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (sibling) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(sibling.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getPreviousBranch()</h4>
			<div class="develop">
			<p>Retourne la branche précédente (pas forcément de même niveau), null s'il n'y en a pas</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> previous = branch.getPreviousBranch();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (previous) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(previous.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getNextBranch()</h4>
			<div class="develop">
			<p>Retourne la branche suivante (pas forcément de même niveau), null s'il n'y en a pas</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> next = branch.getNextBranch();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (next) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(next.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getPreviousOpenedBranch()</h4>
			<div class="develop">
			<p>Retourne la branche ouverte précédente (pas forcément de même niveau), null s'il n'y en a pas</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> opened = branch.getPreviousOpenedBranch();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (opened) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(opened.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getNextOpenedBranch()</h4>
			<div class="develop">
			<p>Retourne la branche ouverte suivante (pas forcément de même niveau), null s'il n'y en a pas</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> opened = branch.getNextOpenedBranch();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (opened) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(opened.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">setText()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>txt <em>(string)</em></th>

					<td>Le nouveau texte de la branche</td></tr>
			</table>
			<p>Set le contenu de la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.setText(<span class="string">"Salut biscuit"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getChildren()</h4>
			<div class="develop">
			<p>Retourne les enfants de la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> children = branch.getChildren();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; children.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(children[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getLevel()</h4>
			<div class="develop">
			<p>Retourne le niveau de la branche. La racine est au niveau 0</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getLevel());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getIcon()</h4>
			<div class="develop">
			<p>Retourne l'icône de la branche lorsque celle-ci n'a pas d'enfants</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getIcon());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getOpenIcon()</h4>
			<div class="develop">
			<p>Retourne l'icône de la branche lorsque celle-ci a des enfants et est ouverte</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getOpenIcon());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getCloseIcon()</h4>
			<div class="develop">
			<p>Retourne l'icône de la branche lorsque celle-ci a des enfants et est fermée</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getCloseIcon());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">getIconSelected()</h4>
			<div class="develop">
			<p>Retourne l'icône de la branche lorsque celle-ci n'a pas d'enfants et est sélectionnée</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getIconSelected());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">getOpenIconSelected()</h4>
			<div class="develop">
			<p>Retourne l'icône de la branche lorsque celle-ci a des enfants et est ouverte et sélectionnée</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getOpenIconSelected());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">getCloseIconSelected()</h4>
			<div class="develop">
			<p>Retourne l'icône de la branche lorsque celle-ci a des enfants et est fermée et sélectionnée</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getCloseIconSelected());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getCurrentIcon()</h4>
			<div class="develop">
			<p>Retourne l'icône actuel de la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getCurrentIcon());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">setIcons()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>icon <em>(string)</em></th>

					<td>L'icône si la branche n'a pas d'enfants</td></tr>
				<tr class="classe"><th>iconOpen <em>(string)</em></th>
					<td>L'icône si la branche a des enfants et est ouverte</td></tr>
				<tr class="classe"><th>iconClose <em>(string)</em></th>
					<td>L'icône si la branche a des enfants et est fermée</td></tr>

			</table>
			<p>Set les icônes de la branche. Si <strong>iconOpen</strong> ou <strong>iconClose</strong> ne sont pas renseignés, ils prennent la valeur de <strong>icon</strong></p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// La branche aura page.g<span class="reserved">if</span> pour tous les états</span></p></td></tr><tr><td><p style="padding-left:4ex;">branch.setIcons(<span class="string">"page.gif"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Ici, on distingue les différents états par différents</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// icônes</span></p></td></tr><tr><td><p style="padding-left:4ex;">branch.setIcons(<span class="string">"page.gif"</span>, <span class="string">"folderopen.gif"</span>, <span class="string">"folder.gif"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">setIconsSelected()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>iconSelected <em>(string)</em></th>

					<td>L'icône si la branche n'a pas d'enfants et est sélectionée</td></tr>
				<tr class="classe"><th>iconOpenSelected <em>(string)</em></th>
					<td>L'icône si la branche a des enfants et est ouverte et sélectionée</td></tr>
				<tr class="classe"><th>iconCloseSelected <em>(string)</em></th>
					<td>L'icône si la branche a des enfants et est fermée et sélectionée</td></tr>

			</table>
			<p>Set les icônes de la branche. Si <strong>iconOpenSelected</strong> ou <strong>iconCloseSelected</strong> ne sont pas renseignés, ils prennent respectivement les valeurs de <strong>iconOpen</strong> et <strong>iconClose</strong> (voir la fonction <em>setIcons()</em>)</p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// La branche aura page.g<span class="reserved">if</span> comme état sélectionné si elle</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// n<span class="string">'a pas d'</span>enfants</span></p></td></tr><tr><td><p style="padding-left:4ex;">branch.setIconsSelected(<span class="string">"page.gif"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Ici, on distingue les différents états par différents</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// icônes</span></p></td></tr><tr><td><p style="padding-left:4ex;">branch.setIconSelected(<span class="string">"page.gif"</span>, <span class="string">"folderopen.gif"</span>, <span class="string">"folder.gif"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">isChild()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>branch <em>(TafelTreeBranch, string)</em></th>

					<td>La branche peut-être parente, ou juste son ID</td></tr>
			</table>
			<p>Méthode qui détermine si la branche est un enfant de celle passée en paramètre. Retourne true si la branche est effectivement une descendante.</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.isChild(<span class="string">"otherBranch"</span>));</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">openIt()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>open <em>(boolean)</em></th>

					<td>True pour ouvrir la branche, false pour la fermer</td></tr>
			</table>
			<p>Méthode qui permet d'ouvrir ou fermer la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.openIt(<span class="reserved">true</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">insertIntoFirst()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>item <em>(object)</em></th>

					<td>Un objet au format JSON correspondant à une TafelTreeBranch</td></tr>
			</table>
			<p>Méthode qui permet d'insérer une branche comme fille, en première de liste</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> item = {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"id"</span> : <span class="string">"branch1"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"txt"</span> : <span class="string">"child first"</span></p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> newBranch = branch.insertIntoFirst(item);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(newBranch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">insertIntoLast()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>item <em>(object)</em></th>

					<td>Un objet au format JSON correspondant à une TafelTreeBranch</td></tr>
			</table>
			<p>Méthode qui permet d'insérer une branche comme fille, en dernière de liste</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> item = {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"id"</span> : <span class="string">"branch2"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"txt"</span> : <span class="string">"child last"</span></p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> newBranch = branch.insertIntoLast(item);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(newBranch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">insertBefore()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>item <em>(object)</em></th>

					<td>Un objet au format JSON correspondant à une TafelTreeBranch</td></tr>
			</table>
			<p>Méthode qui permet d'insérer une branche comme soeur, juste avant elle</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> item = {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"id"</span> : <span class="string">"branch3"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"txt"</span> : <span class="string">"sibling first"</span></p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> newBranch = branch.insertBefore(item);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(newBranch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">insertAfter()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>item <em>(object)</em></th>

					<td>Un objet au format JSON correspondant à une TafelTreeBranch</td></tr>
			</table>
			<p>Méthode qui permet d'insérer une branche comme soeur, juste après elle</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> item = {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"id"</span> : <span class="string">"branch4"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"txt"</span> : <span class="string">"sibling last"</span></p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> newBranch = branch.insertAfter(item);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(newBranch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">clone()</h4>
			<div class="develop">
			<p>Permet de cloner la strucutre de la branche. Ne créé pas une nouvelle branche. Elle ne fait que de retourner
			la structure initiale.</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> clonedStructure = branch.clone();</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;">clonedStructure.id = <span class="string">"newid"</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">clonedStructure.txt = <span class="string">"Ma nouvelle branche clonée"</span>;</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> newBranch = branch.insertAfter(clonedStructure);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(newBranch.getId());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Ne créé pas la nouvelle branche dans l'arbre. Ne retourne que la structure</li>
				<li>La structure est toujours au format JSON</li>
			</ul>
			</div>

			<h4 onclick="shownext(this)">move()</h4>

			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>here <em>(TafelTreeBranch, string)</em></th>
					<td>La nouvelle branche parente, ou juste son ID</td></tr>
			</table>
			<p>Méthode qui permet de changer une branche de place, en la plaçant comme fille</p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.move(<span class="string">"idNewParent"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">moveBefore()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>here <em>(TafelTreeBranch, string)</em></th>

					<td>La branche soeur, ou juste son ID</td></tr>
			</table>
			<p>Méthode qui permet de changer une branche de place, en la plaçant comme soeur</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.moveBefore(<span class="string">"idNewSibling"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">closeSiblings()</h4>
			<div class="develop">
			<p>Ferme toutes les branches soeurs</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.closeSiblings();</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">addClass()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>class <em>(string)</em></th>

					<td>La classe CSS à ajouter</td></tr>
			</table>
			<p>Méthode qui ajoute une classe CSS à la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.addClass(<span class="string">"myCSSclass"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">removeClass()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>class <em>(string)</em></th>

					<td>La classe CSS à retirer</td></tr>
			</table>
			<p>Méthode qui retire une classe CSS à la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.removeClass(<span class="string">"myCSSclass"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">removeChildren()</h4>
			<div class="develop">
			<p>Méthode qui supprime tous les enfants de la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.removeChildren();</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">hasAllChildrenChecked()</h4>
			<div class="develop">
			<p>Retourne 1 si tous les enfants de la branche sont checkés, 0 si aucuns ne le sont et -1 si certains le sont</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.hasAllChildrenChecked());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">isChecked()</h4>
			<div class="develop">
			<p>Retourne 1 si la branche est checkée, 0 si elle ne l'est pas et -1 si elle est partiellement checkée</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.isChecked());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">check()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>check <em>(integer)</em></th>

					<td>Le status à donner à la branche</td></tr>
			</table>
			<p>Passer 1 pour la checker, 0 pour la unchecker</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.check(1);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">select()</h4>
			<div class="develop">
			<p>Sélectionne la branche et place le focus dessus</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.select();</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">unselect()</h4>
			<div class="develop">
			<p>Désélectionne la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = tree.getSelectedBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (branches.length > 0) {</p></td></tr><tr><td><p style="padding-left:8ex;">branches[0].unselect();</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">getWithinOffset()</h4>
			<div class="develop">
			<p>Récupère les coordonnées de la branche au sein de l'arbre</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> pos = branch.getWithinOffset();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(<span class="string">"Left : "</span> + pos[0] + <span class="string">", Top : "</span> + pos[1]);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">getAbsoluteOffset()</h4>
			<div class="develop">
			<p>Récupère les coordonnées de la branche dans l'écran</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> pos = branch.getAbsoluteOffset();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(<span class="string">"Left : "</span> + pos[0] + <span class="string">", Top : "</span> + pos[1]);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>


			<h2>Méthodes de TafelTreeBranch découlant de TafelTree</h2>

			<h4 onclick="shownext(this)">serialize()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">

				<tr><th>debug <em>(boolean)</em></th>
					<td>Mettre true pour avoir un joli affichage du contenu de la branche. UNIQUEMENT POUR LE DEBUG. False par défaut</td></tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On met <span class="reserved">true</span> pour visualiser et contrôler la string</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.serialize(<span class="reserved">true</span>));</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On met rien pour traiter la string</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">new</span> Ajax.Request(<span class="string">"mapage.php"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"parameters"</span>: <span class="string">"tree="</span> + branch.serialize()</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">countBranches()</h4>
			<div class="develop">
			<p>Compte le nombre de branches contenues dans la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.countBranches());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getOpenedBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches ouvertes sous la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = branch.getOpenedBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getCheckedBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches checkées sous la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = branch.getCheckedBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getUnCheckedBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches non checkées sous la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = branch.getUnCheckedBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getPartCheckedBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches partiellement checkées sous la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = branch.getPartCheckedBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getParentBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches qui ont des enfants</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = branch.getParentBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getLeafBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches qui n'ont pas d'enfants</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = branch.getLeafBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">getBranches()</h4>
			<div class="develop">
				<h4>Paramètres</h4>
				<table class="prop">
					<tr><th>filter <em>(function)</em></th>

						<td>La fonction utilisateur</td></tr>
				</table>
				<p>Retourne un tableau contenant toutes les branches sous celle-ci. On peut y mettre un filtre.</p>
				<h4>Exemples</h4>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = branch.getBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On peut filtrer les branches avec une fonction</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myFilter (branch) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">if</span> (branch.getText() == <span class="string">"Celle-ci"</span>) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">return</span> <span class="reserved">true</span>;</p></td></tr><tr><td><p style="padding-left:8ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">return</span> <span class="reserved">false</span>;</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = branch.getBranches(myFilter);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">expend()</h4>
			<div class="develop">
			<p>Ouvre toutes les branches sous la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.expend();</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">collapse()</h4>
			<div class="develop">
			<p>Ferme toutes les branches sous la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">branch.collapse();</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>


			<h1>Méthodes TafelTree</h1>
			<h2>Méthodes TafelTree statiques</h2>
			<h4 onclick="shownext(this)">loadFromUL()</h4>
			<div class="develop">
			<h4>Paramètres</h4>

			<table class="prop">
				<tr>
					<th>id <em>(string)</em></th>
					<td>L'id de l'UL qui contient les informations</td>
				</tr>
				<tr class="classe">
					<th>imgBase (optionnel) <em>(string)</em></th>

					<td>Le chemin vers le dossier des images de l'arbre, " imgs/ " par défaut</td>
				</tr>
				<tr class="classe">
					<th>width (optionnel) <em>(string ou integer)</em></th>
					<td>La largeur max de l'arbre, " 100% " par défaut</td>
				</tr>
				<tr class="classe">

					<th>height (optionnel) <em>(string ou integer)</em></th>
					<td>La hauteur max de l'arbre, " auto " par défaut</td>
				</tr>
				<tr class="classe">
					<th>options (optionnel) <em>(object)</em></th>
					<td>Tout ce qui doit s'exécuter avant le generate(), génération comprise</td>

				</tr>
				<tr class="classe">
					<th>debug (optionnel) <em>(boolean)</em></th>
					<td>A True, Affiche la structure JSON mais ne créé pas l'arbre, false par défaut</td>
				</tr>
			</table>
			<p>La génération par UL ne permet pas de gérer ses propres attributs. Pour ce qui est des fonctions de l'arbre, on doit les gérer via le paramètre <strong>options</strong>.
			Pour plus de détails sur ce paramètre, voir <a href="#new">new TafelTree()</a></p>

			<h4>Exemple</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr><tr><th>31</th></tr><tr><th>32</th></tr><tr><th>33</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;ul id=<span class="string">"idTree"</span>></p></td></tr><tr><td><p style="padding-left:4ex;">&lt;li id=<span class="string">"b1"</span> Timg=<span class="string">"base.gif"</span>>Mon texte&lt;/li></p></td></tr><tr><td><p style="padding-left:4ex;">&lt;li id=<span class="string">"b2"</span> Timg=<span class="string">"base.gif"</span>>Texte autre</p></td></tr><tr><td><p style="padding-left:8ex;">&lt;ul></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;li id=<span class="string">"b3"</span> Timg=<span class="string">"page.gif"</span> >Enfant&lt;/li></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;li id=<span class="string">"b4"</span> Timg=<span class="string">"page.gif"</span> Timgclose=<span class="string">"folder.gif"</span></p></td></tr><tr><td><p style="padding-left:16ex;">Timgopen=<span class="string">"folderopen.gif"</span>>Autre Enfant</p></td></tr><tr><td><p style="padding-left:16ex;">&lt;ul></p></td></tr><tr><td><p style="padding-left:20ex;">&lt;li id=<span class="string">"b5"</span> Timg=<span class="string">"page.gif"</span>>Enfant&lt;/li></p></td></tr><tr><td><p style="padding-left:20ex;">&lt;li id=<span class="string">"b6"</span> Timg=<span class="string">"page.gif"</span> Teditable=<span class="string">"1"</span>></p></td></tr><tr><td><p style="padding-left:24ex;">Autre Enfant&lt;/li></p></td></tr><tr><td><p style="padding-left:16ex;">&lt;/ul></p></td></tr><tr><td><p style="padding-left:12ex;">&lt;/li></p></td></tr><tr><td><p style="padding-left:8ex;">&lt;/ul></p></td></tr><tr><td><p style="padding-left:4ex;">&lt;/li></p></td></tr><tr><td><p style="padding-left:4ex;">&lt;li id=<span class="string">"b7"</span> Timg=<span class="string">"base.gif"</span>>Fin&lt;/li></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/ul></p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myFuncClick(branch) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branch.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = TafelTree.loadFromUL(<span class="string">"idTree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"imgBase"</span> : <span class="string">"imgs/"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"width"</span> : <span class="string">"300px"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"height"</span> : <span class="string">"250px"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onClick"</span> : myFuncClick,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"openAtLoad"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Les fonctions à faire avant la génération (génération comprise) sont chargées via le paramètre OPTIONS</li>
				<li>Tous les attributs des branches sont précédés d'un " T " sauf l'id</li>
				<li>Les attributs de branches sont les mêmes que pour le JSON</li>
				<li>L'attribut n'est <em>JAMAIS</em> entre guillemets et son contenu est <em>ÉCHAPPÉ (simple quotes)</em> et <em>TOUJOURS</em> entre guillemets</li>

				<li>Le contenu d'un attribut <em>NE DOIT PAS</em> contenir de double quotes (guillemets)</li>
				<li>Il n'est pas possible d'assigner des attributs persos, malheureusement</li>
			</ul>
			</div>

			<h2>Getter et setter TafelTree</h2>

			<a name="new"></a>
			<h4 onclick="shownext(this)">new TafelTree()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>id <em>(string)</em></th>

					<td>L'id du DIV qui contiendra l'ensemble de l'arbre</td>
				</tr>
				<tr>
					<th>struct <em>(array)</em></th>
					<td>La structure de l'arbre formatté JSON</td>
				</tr>
				<tr class="classe">

					<th>imgBase (optionnel) <em>(string)</em></th>
					<td>Le chemin vers le dossier des images de l'arbre, " imgs/ " par défaut</td>
				</tr>
				<tr class="classe">
					<th>width (optionnel) <em>(string ou integer)</em></th>
					<td>La largeur max de l'arbre, " 100% " par défaut</td>

				</tr>
				<tr class="classe">
					<th>height (optionnel) <em>(string ou integer)</em></th>
					<td>La hauteur max de l'arbre, " auto " par défaut</td>
				</tr>
				<tr class="classe">
					<th>options (optionnel) <em>(object)</em></th>

					<td>Tout ce qui doit s'exécuter avant le generate(), génération comprise</td>
				</tr>
			</table>
			<h4>Exemple</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr><tr><th>31</th></tr><tr><th>32</th></tr><tr><th>33</th></tr><tr><th>34</th></tr><tr><th>35</th></tr><tr><th>36</th></tr><tr><th>37</th></tr><tr><th>38</th></tr><tr><th>39</th></tr><tr><th>40</th></tr><tr><th>41</th></tr><tr><th>42</th></tr><tr><th>43</th></tr><tr><th>44</th></tr><tr><th>45</th></tr><tr><th>46</th></tr><tr><th>47</th></tr><tr><th>48</th></tr><tr><th>49</th></tr><tr><th>50</th></tr><tr><th>51</th></tr><tr><th>52</th></tr><tr><th>53</th></tr><tr><th>54</th></tr><tr><th>55</th></tr><tr><th>56</th></tr><tr><th>57</th></tr><tr><th>58</th></tr><tr><th>59</th></tr><tr><th>60</th></tr><tr><th>61</th></tr><tr><th>62</th></tr><tr><th>63</th></tr><tr><th>64</th></tr><tr><th>65</th></tr><tr><th>66</th></tr><tr><th>67</th></tr><tr><th>68</th></tr><tr><th>69</th></tr><tr><th>70</th></tr><tr><th>71</th></tr><tr><th>72</th></tr><tr><th>73</th></tr><tr><th>74</th></tr><tr><th>75</th></tr><tr><th>76</th></tr><tr><th>77</th></tr><tr><th>78</th></tr><tr><th>79</th></tr><tr><th>80</th></tr><tr><th>81</th></tr><tr><th>82</th></tr><tr><th>83</th></tr><tr><th>84</th></tr><tr><th>85</th></tr><tr><th>86</th></tr><tr><th>87</th></tr><tr><th>88</th></tr><tr><th>89</th></tr><tr><th>90</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;div id=<span class="string">"idTree"</span>>&lt;/div></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> myStruct = [</p></td></tr><tr><td><p style="padding-left:4ex;">{</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"id"</span> : <span class="string">"root"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"txt"</span> : <span class="string">"Root node"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"img"</span> : <span class="string">"base.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"style"</span> : <span class="string">"cssBoldStyle"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"items"</span> : [</p></td></tr><tr><td><p style="padding-left:8ex;">{</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">"id"</span> : <span class="string">"node1"</span>,</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">"txt"</span> : <span class="string">"Node 1"</span>,</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">"img"</span> : <span class="string">"folderopen.gif"</span></p></td></tr><tr><td><p style="padding-left:8ex;">},</p></td></tr><tr><td><p style="padding-left:8ex;">{</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">"id"</span> : <span class="string">"music"</span>,</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">"txt"</span> : <span class="string">"My music"</span>,</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">"img"</span> : <span class="string">"musicfolder.gif"</span></p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:8ex;">]</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">];</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"imgBase"</span> : <span class="string">"imgs/"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"width"</span> : <span class="string">"300px"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"height"</span> : <span class="string">"150px"</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Example using options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> treeToBind = <span class="reserved">new</span> TafelTree(<span class="string">"idTreeToBind"</span>, structBind, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"imgBase"</span> : <span class="string">"imgs/"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"width"</span> : <span class="string">"300px"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"height"</span> : <span class="string">"150px"</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> treeToBind2 = <span class="reserved">new</span> TafelTree(<span class="string">"idTreeToBind2"</span>, structBind2, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"imgBase"</span> : <span class="string">"imgs/"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"width"</span> : <span class="string">"300px"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"height"</span> : <span class="string">"150px"</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"imgBase"</span> : <span class="string">"imgs/"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"width"</span> : <span class="string">"300px"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"height"</span> : <span class="string">"250px"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImg"</span> : <span class="string">"page.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImgOpen"</span> : <span class="string">"folderopen.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImgClose"</span> : <span class="string">"folder.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImgSelected"</span> : <span class="string">"page.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImgOpenSelected"</span> : <span class="string">"folderopen.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImgCloseSelected"</span> : <span class="string">"folder.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onLoad"</span> : myFuncLoad,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onDebug"</span> : myFuncDebug,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onCheck"</span> : myFuncCheck,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onBeforeCheck"</span> : myFuncBeforeCheck,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onClick"</span> : myFuncClick,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onDblClick"</span> : myFuncDblClick,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onBeforeOpen"</span> : myFuncBeforeOpen,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onOpen"</span> : myFunconOpen,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onMouseOver"</span> : myFuncMouseOver,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onMouseOut"</span> : myFuncMouseOut,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onMouseDown"</span> : myFuncMouseDown,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onMouseUp"</span> : myFuncMouseUp,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onDrop"</span> : myFuncDrop,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onEdit"</span> : myFuncEdit,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onEditAjax"</span> : [myFuncEditAjax, <span class="string">"server/edit.php"</span>],</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onDropAjax"</span> : [myFuncDropAjax, <span class="string">"server/drop.php"</span>]</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onOpenPopulate"</span> : [myFuncOpenPopulate, <span class="string">"server/open.php"</span>],</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"multiline"</span> : <span class="reserved">false</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"checkboxes"</span> : <span class="reserved">false</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"checkboxesThreeState"</span> : <span class="reserved">false</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"cookies"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"openOneAtOnce"</span> : <span class="reserved">false</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"openAtLoad"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"openAfterAdd"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"showSelectedBranch"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"lineStyle"</span> : <span class="string">"line"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"rtlMode"</span> : <span class="reserved">false</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"dropALT"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"dropCTRL"</span> : <span class="reserved">false</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"propagateRestriction"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"reopenFromServer"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"behaviourDrop"</span> : <span class="string">"child"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"bind"</span> : [treeToBind],</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"bindAsUnidirectional"</span> : [treeToBind2]</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">enableMultiline()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>enable <em>(boolean)</em></th>

					<td>True pour activer la gestion multi-ligne (par défaut, false)</td>
				</tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.enableMultiline(<span class="reserved">true</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"multiline"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">reopenFromServerAfterLoad()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>enable <em>(boolean)</em></th>

					<td>False pour ne pas ouvrir les noeuds qui ont leurs enfants sur le serveur après un reload, true par défaut</td>
				</tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.reopenFromServerAfterLoad(<span class="reserved">true</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"reopenFromServer"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">enableCheckboxes()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>enable <em>(boolean)</em></th>

					<td>True pour activer la gestion des checkboxes à 2 états (par défaut, false)</td>
				</tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.enableCheckboxes(<span class="reserved">true</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"checkboxes"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Les checkboxes à deux états peuvent être soit " checked ", soit " unchecked "</li>
				<li>Pour gérer 3 états, voir la fonction enableCheckboxesThreeState()</li>
			</ul>
			</div>

			<h4 onclick="shownext(this)">enableCheckboxesThreeState()</h4>

			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>enable <em>(boolean)</em></th>
					<td>True pour activer la gestion des checkboxes à 3 états (par défaut, false)</td>
				</tr>

			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.enableCheckboxesThreeState(<span class="reserved">true</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"checkboxesThreeState"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Il n'y a pas besoin d'appeler la méthode enableCheckboxes().</li>
			</ul>
			</div>

			<h4 onclick="shownext(this)">enableCookies()</h4>
			<div class="develop">

			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>enable <em>(boolean)</em></th>
					<td>True pour activer les cookies (par défaut, true)</td>
				</tr>
				<tr class="classe">

					<th>separator (optionnel) <em>(string)</em></th>
					<td>Le séparateur utilisé dans les cookies (par défaut, " | ")</td>
				</tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.enableCookies(<span class="reserved">true</span>, <span class="string">"#___#"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options. On ne peut pas choisir le séparateur, depuis lé</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"cookies"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Les cookies permettent de se souvenir de quelles branches sont ouvertes</li>
				<li>Changer le séparateur peut servir si une barre verticale fait partie de l'id des branches</li>
			</ul>
			</div>

			<h4 onclick="shownext(this)">openOneAtOnce()</h4>

			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>enable <em>(boolean)</em></th>
					<td>True pour ne pouvoir ouvrir qu'une seule branche à la fois (par défaut, false)</td>
				</tr>

			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.openOneAtOnce(<span class="reserved">true</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"openOneAtOnce"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">openAtLoad()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>open <em>(boolean)</em></th>

					<td>True pour avoir l'arbre ouvert après le premier load (par défaut, false)</td>
				</tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.openAtLoad(<span class="reserved">true</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"openAtLoad"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Lorsque les cookies sont activés, ceux-ci prennent le pas sur cette fonction</li>
			</ul>
			</div>

			<h4 onclick="shownext(this)">openAfterAdd()</h4>
			<div class="develop">

			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>open <em>(boolean)</em></th>
					<td>True pour avoir la branche qui s'ouvre après un insert ou un drop, false pour la garder fermée</td>
				</tr>
			</table>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.openAfterAdd(<span class="reserved">false</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"openAfterAdd"</span> : <span class="reserved">false</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">showSelectedBranch()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>show <em>(boolean)</em></th>

					<td>True pour avoir la branche sélectionnée en surbrillance (par défaut, true)</td>
				</tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.showSelectedBranch(<span class="reserved">false</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"showSelectedBranch"</span> : <span class="reserved">false</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">setLineStyle()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>style <em>(string)</em></th>

					<td>Le style choisi pour l'affichage de l'arbre (par défaut, " line ")</td>
				</tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.setLineStyle(<span class="string">"none"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"lineStyle"</span> : <span class="string">"none"</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Les valeurs possibles sont " line ", " full " ou " none ".</li>
			</ul>
			</div>

			<h4 onclick="shownext(this)">setIcons()</h4>
			<div class="develop">

			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>icon <em>(string)</em></th>
					<td>L'icône si la branche n'a pas d'enfants</td></tr>
				<tr class="classe"><th>iconOpen <em>(string)</em></th>
					<td>L'icône si la branche a des enfants et est ouverte</td></tr>

				<tr class="classe"><th>iconClose <em>(string)</em></th>
					<td>L'icône si la branche a des enfants et est fermée</td></tr>
			</table>
			<p>Set les icônes par défaut des branches. Si <strong>iconOpen</strong> ou <strong>iconClose</strong> ne sont pas renseignés, ils prennent la valeur de <strong>icon</strong></p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.setIcons(<span class="string">"page.gif"</span>, <span class="string">"folderopen.gif"</span>, <span class="string">"folder.gif"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImg"</span> : <span class="string">"page.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImgOpen"</span> : <span class="string">"folderopen.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImgClose"</span> : <span class="string">"folder.gif"</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">setIconsSelected()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>iconSelected <em>(string)</em></th>

					<td>L'icône si la branche n'a pas d'enfants et est sélectionée</td></tr>
				<tr class="classe"><th>iconOpenSelected <em>(string)</em></th>
					<td>L'icône si la branche a des enfants et est ouverte et sélectionée</td></tr>
				<tr class="classe"><th>iconCloseSelected <em>(string)</em></th>
					<td>L'icône si la branche a des enfants et est fermée et sélectionée</td></tr>

			</table>
			<p>Set les icônes de la branche. Si <strong>iconOpenSelected</strong> ou <strong>iconCloseSelected</strong> ne sont pas renseignés, ils prennent respectivement les valeurs de <strong>iconOpen</strong> et <strong>iconClose</strong> (voir la fonction <em>setIcons()</em>)</p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.setIconsSelected(<span class="string">"page.gif"</span>, <span class="string">"folderopen.gif"</span>, <span class="string">"folder.gif"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImgSelected"</span> : <span class="string">"page.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImgOpenSelected"</span> : <span class="string">"folderopen.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"defaultImgCloseSelected"</span> : <span class="string">"folder.gif"</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<a name="#behaviourDrop"></a>
			<h4 class="new" onclick="shownext(this)">setBehaviourDrop()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>dropStyle <em>(string)</em></th>

					<td>'sibling', 'siblingcopy', 'child' ou 'childcopy', suivant le type de drop voulu, 'child' par défaut</td></tr>
			</table>
			<p>Set le comportement de drop par défaut. En mettant <strong>sibling</strong>, on droppera les branches comme soeur ou, en maintenant ALT appuyé, comme fille. Et inversément si on met <strong>child</strong>.</p>
			<p>Si on opte pour <strong>siblingcopy</strong>, on droppera les branches comme soeur et sera un copie ou, en maintenant ALT + CTRL appuyé, comme fille et pas copie. En fait, ça inverse les comportements des touches ALT et CTRL. Le mieux pour comprendre, c'est d'essayer...</p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.setBehaviourDrop(<span class="string">"sibling"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"behaviourDrop"</span> : <span class="string">"sibling"</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">disableDropCTRL()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>ctrlDrop <em>(boolean)</em></th>

					<td>False désactive la fonctionnalité CTRL avec drop, la valeur par défaut est true</td></tr>
			</table>
			<p>En passant "false", la touche CTRL sera désactivée. Il ne sera plus possible de faire des copy-drag. Un copy-drag copie la branche drag&dropée à l'emplacement de drop. Un insertDrag déplace simplement la branche sans pour autant en créer une nouvelle.</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.disableDropCTRL(<span class="reserved">false</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"dropCTRL"</span> : <span class="reserved">false</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">disableDropALT()</h4>
			<div class="develop">
			<h4>Arguments</h4>
			<table class="prop">
				<tr><th>altDrop <em>(string)</em></th>

					<td>False désactive la fonctionnalité ALT avec drop, la valeur par défaut est true</td></tr>
			</table>
			<p>False enlève la possibilité d'avoir 2 différents types de drop. Soit "comme soeur" soit "comme fille". En passant "false", il ne
			sera possible de faire que les types de drop définis par la fonction <a href="#">setBehaviourDrop()</a></p>
			<h4>Samples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.disableDropALT(<span class="reserved">false</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"dropALT"</span> : <span class="reserved">false</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">propagateRestriction()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>propagate <em>(boolean)</em></th>

					<td>True pour propager l'interdiction de bouger après un drag&drop ajax (par défaut, true)</td>
				</tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.setOnDropAjax(myFunc, <span class="string">"mypage.php"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.propagateRestriction(<span class="reserved">false</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onDropAjax"</span> : [myFunc, <span class="string">"mypage.php"</span>],</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"propagateRestriction"</span> : <span class="reserved">false</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>La propagation implique que les enfants de la branche droppée sont également bloqués (pour éviter des problèmes de croisements de données)</li>
			</ul>
			</div>

			<h4 class="new" onclick="shownext(this)">enableRTL()</h4>
			<div class="develop">

			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>rtl <em>(boolean)</em></th>
					<td>True pour avoir l'arbre qui se lit de droite à gauche (par défaut, false)</td>
				</tr>
			</table>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.enableRTL(<span class="reserved">true</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Options</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"rtlMode"</span> : <span class="reserved">true</span></p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>


			<h2>Méthodes TafelTree publiques</h2>
			<h4 onclick="shownext(this)">generate()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">

				<tr>
					<th>partLoad <em>(boolean)</em></th>
					<td>True pour générer l'arbre petit-à-petit (expérimental), false par défaut</td>
				</tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.generate();</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On peut générer l"arbre petit-à-petit (pour les gros arbre)</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Attention, c"est vaguement expérimental;</span></p></td></tr><tr><td><p style="padding-left:4ex;">tree.generate(<span class="reserved">true</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">serialize()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>debug <em>(boolean)</em></th>

					<td>Mettre true pour avoir un joli affichage du contenu de l'arbre. UNIQUEMENT POUR LE DEBUG. False par défaut</td></tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe que la structure est définie en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree(<span class="string">"idTree"</span>, myStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.generate();</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On met <span class="reserved">true</span> pour visualiser et contrôler la string</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(tree.serialize(<span class="reserved">true</span>));</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On met rien pour traiter la string</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">new</span> Ajax.Request(<span class="string">"mapage.php"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"parameters"</span> : <span class="string">"tree="</span> + tree.serialize()</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getSelectedBranches()</h4>
			<div class="develop">
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> selected = tree.getSelectedBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (selected.length > 0) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; selected.length; i++) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(selected[i].getId());</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getBranchById()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>id <em>(string)</em></th>

					<td>L'id de la branche</td></tr>
			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch = tree.getBranchById(<span class="string">"idBranch"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(branch.getId();</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">bind()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>tree <em>(TafelTree)</em></th>

					<td>L'arbre avec lequel on veut faire le lien</td></tr>
				<tr class="classe"><th>tree <em>(TafelTree)</em></th>
					<td>Un autre arbre</td></tr>
				<tr class="classe"><th>... <em>(TafelTree)</em></th>
					<td>Autant d'autres arbres que l'on veut</td></tr>

			</table>
			<p>Le lien bi-directionnel permet de faire, en une fois, les liens drag&drop entre les arbres, dans les deux sens (arbre1 vers arbre2 et vice-versa)</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// A noter dans ce cas qu"on pourra faire des drag&drop de</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// tree vers tree_2, et inversément</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree_2 = <span class="reserved">new</span> TafelTree(<span class="string">"idTree_2"</span>, myOtherStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.bind(tree_2);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Le lien sert à pouvoir faire des drag&drop entre les arbres</li>
				<li>Ce lien est bi-directionnel</li>
			</ul>
			</div>

			<h4 onclick="shownext(this)">bindAsUnidirecitonal()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>tree <em>(TafelTree)</em></th>
					<td>L'arbre avec lequel on veut faire le lien</td></tr>

				<tr class="classe"><th>tree <em>(TafelTree)</em></th>
					<td>Un autre arbre</td></tr>
				<tr class="classe"><th>... <em>(TafelTree)</em></th>
					<td>Autant d'autres arbres que l'on veut</td></tr>
			</table>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// A noter dans ce cas qu"on ne pourra faire des drag&drop</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// que de tree vers tree_2 et pas inversément</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree_2 = <span class="reserved">new</span> TafelTree(<span class="string">"idTree_2"</span>, myOtherStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.bindAsUnidirecitonal(tree_2);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Le lien sert à pouvoir faire des drag&drop entre les arbres</li>
				<li>Ce lien est uni-directionnel</li>
			</ul>
			</div>

			<h4 onclick="shownext(this)">isBindedWith()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>tree <em>(TafelTree)</em></th>
					<td>L'arbre avec lequel on veut savoir s'il y a un lien</td></tr>

			</table>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree_2 = <span class="reserved">new</span> TafelTree(<span class="string">"idTree_2"</span>, myOtherStruct);</p></td></tr><tr><td><p style="padding-left:4ex;">tree.bindAsUnidirectional(tree_2);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(tree.isBindedWith(tree_2)); <span class="comment">// retourne <span class="reserved">true</span></span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(tree_2.isBindedWith(tree)); <span class="comment">// retourne <span class="reserved">false</span></span></p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">unselect()</h4>
			<div class="develop">
			<p>Déselectionne la branche, s'il y en avait une sélectionnée</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;">tree.unselect();</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">countBranches()</h4>
			<div class="develop">
			<p>Compte le nombre de branches contenues dans l'arbre</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(tree.countBranches());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getOpenedBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches ouvertes</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = tree.getOpenedBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getCheckedBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches checkées</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = tree.getCheckedBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getUnCheckedBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches non checkées</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = tree.getUnCheckedBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getPartCheckedBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches partiellement checkées</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = tree.getPartCheckedBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getParentBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches qui ont des enfants</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = tree.getParentBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">getLeafBranches()</h4>
			<div class="develop">
			<p>Retourne un tableau contenant les branches qui n'ont pas d'enfants</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = tree.getLeafBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">getBranches()</h4>
			<div class="develop">
				<h4>Paramètres</h4>
				<table class="prop">
					<tr><th>filter <em>(function)</em></th>

						<td>La fonction utilisateur</td></tr>
				</table>
				<p>Retourne un tableau contenant toutes les branches de l'arbre. On peut y mettre un filtre.</p>
				<h4>Exemples</h4>
				<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu'un arbre a été créé auparavant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = tree.getBranches();</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On peut filtrer les branches avec une fonction</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myFilter (branch) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">if</span> (branch.getText() == <span class="string">"Celle-ci"</span>) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">return</span> <span class="reserved">true</span>;</p></td></tr><tr><td><p style="padding-left:8ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">return</span> <span class="reserved">false</span>;</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branches = tree.getBranches(myFilter);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">for</span> (<span class="reserved">var</span> i = 0; i &lt; branches.length; i++) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branches[i].getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">expend()</h4>
			<div class="develop">
			<p>Ouvre toutes les branches</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;">tree.expend();</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">collapse()</h4>
			<div class="develop">
			<p>Ferme toutes les branches</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;">tree.collapse();</p></td></tr><tr><td><p style="padding-left:4ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">insertBranch()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>position <em>(TafelTreeBranch, string)</em></th>

					<td>La branche source (ou juste l'id)</td></tr>
				<tr><th>item <em>(object)</em></th>
					<td>La nouvelle branche (au format <a href="#tag"><em>TafelTreeBranch properties</em></a>)</td></tr>
				<tr class="classe"><th>sibling <em>(boolean)</em></th>
					<td>True pour indiquer qu'on veut l'insérer en tant que soeur, par défaut false</td></tr>

				<tr class="classe"><th>first <em>(boolean)</em></th>
					<td>True pour indiquer qu'on veut l'insérer avant ou en premier, false par défaut</td></tr>
			</table>
			<p>Premet de rajouter une branche comme fille ou comme soeur, avant ou après la branche désirée</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr><tr><th>31</th></tr><tr><th>32</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> item = {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"id"</span>:<span class="string">"new1"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"img"</span>:<span class="string">"page.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"txt"</span>:<span class="string">"child before"</span></p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> item2 = {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"id"</span>:<span class="string">"new2"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"img"</span>:<span class="string">"page.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"txt"</span>:<span class="string">"child after"</span></p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> item3 = {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"id"</span>:<span class="string">"new3"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"img"</span>:<span class="string">"page.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"txt"</span>:<span class="string">"sibling before"</span></p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> item4 = {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"id"</span>:<span class="string">"new4"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"img"</span>:<span class="string">"page.gif"</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"txt"</span>:<span class="string">"sibling after"</span></p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Branche fille (enfant) - en premier</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch1 = tree.insertBranch(<span class="string">"id_branch"</span>, item, <span class="reserved">false</span>, <span class="reserved">true</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Branche fille (enfant) - en dernier</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch2 = tree.insertBranch(<span class="string">"id_branch"</span>, item2, <span class="reserved">false</span>, <span class="reserved">false</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Branche soeur - avant</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch3 = tree.insertBranch(<span class="string">"id_branch"</span>, item3, <span class="reserved">true</span>, <span class="reserved">true</span>);</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Branche soeur - après</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> branch4 = tree.insertBranch(<span class="string">"id_branch"</span>, item4, <span class="reserved">true</span>, <span class="reserved">false</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">removeBranch()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>branch <em>(TafelTreeBranch, string)</em></th>

					<td>La branche source (ou juste l'id)</td></tr>
			</table>
			<p>Supprime la branche est toutes ses filles</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;">tree.removeBranch(<span class="string">"id_branch_to_delete"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">debug()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>str <em>(string)</em></th>

					<td>Le texte à afficher</td></tr>
			</table>
			<p>Affiche un texte dans la zone de débug</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On part du principe qu"un arbre a été généré en amont</span></p></td></tr><tr><td><p style="padding-left:4ex;">tree.debug(<span class="string">"text to debug : "</span> + tree.id);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h2>Méthodes TafelTree d'événements</h2>
			<h4 onclick="shownext(this)">setOnDebug()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée lorsqu'on fait appel à tree.debug()</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myDebug (tree, HTMLDebugObj, str) {</p></td></tr><tr><td><p style="padding-left:8ex;">HTMLDebugObj.innerHTML = <span class="string">"Ma fonction : "</span> + str;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onDebug"</span> : myDebug</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;">tree.debug(<span class="string">"text to debug"</span>);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Par défaut, la méthode tree.debug() affiche simplement le texte dans le HTMLDebugObj</li>
			</ul>
			</div>

			<h4 onclick="shownext(this)">setOnLoad()</h4>
			<div class="develop">

			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>
					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée lorsque l'arbre a fini de loader (en le générant avec true : <strong>tree.generate(true)</strong>)</p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myLoad () {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(<span class="string">"load terminé"</span>);</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onLoad"</span> : myLoad</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">setOnOpen()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée après qu'une branche ait été ouverte (<em>status = true</em>) ou fermée (<em>status = false</em>)</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myOpen (branch, status) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">var</span> str = (status) ? <span class="string">"ouverte"</span> : <span class="string">"fermée"</span>;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branch.getId() + <span class="string">" a été "</span> + str);</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onOpen"</span> : myOpen</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">setOnBeforeOpen()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée avant qu'une branche soit ouverte (<em>status = true</em>) ou fermée (<em>status = false</em>). Si elle retourne <strong>false</strong>, la branche conservera son status actuel.</p>
			<h4>Exemples</h4>

			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myBeforeOpen (branch, status) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">var</span> strNow = (status) ? <span class="string">"ouverte"</span> : <span class="string">"fermée"</span>;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">var</span> strNext = (status) ? <span class="string">"fermée"</span> : <span class="string">"ouverte"</span>;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branch.getId() + <span class="string">" est actuellement "</span> + strNow +</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">" et sera donc "</span> + strNext +</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">" si cette fonction retourne <span class="reserved">true</span>"</span>);</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> <span class="reserved">true</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onBeforeOpen"</span> : myBeforeOpen</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">setOnMouseOver()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée lorsque la souris passe sur la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myMouseOver (branch) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(<span class="string">"over : "</span> + branch.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onMouseOver"</span> : myMouseOver</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">setOnMouseOut()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée lorsque la souris n'est plus sur la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myMouseOut (branch) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(<span class="string">"out : "</span> + branch.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onMouseOut"</span> : myMouseOut</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">setOnMouseDown()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée lorsqu'on fait un "mouse down" sur la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// User <span class="reserved">function</span></span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myMouseDown (branch) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(<span class="string">"down : "</span> + branch.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onMouseDown"</span> : myMouseDown</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">setOnMouseUp()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée lorsqu'on fait un "mouse up" sur la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// User <span class="reserved">function</span></span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myMouseUp (branch) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(<span class="string">"up : "</span> + branch.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onMouseUp"</span> : myMouseUp</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">setOnClick()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée lorsqu'on clique sur la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myClick (branch) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branch.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onClick"</span> : myClick</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Quoiqu'il arrive, la branche sur laquelle on clique sera sélectionnée</li>
			</ul>
			</div>

			<h4 onclick="shownext(this)">setOnDblClick()</h4>
			<div class="develop">

			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>
					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée lorsqu'on double-clique sur la branche</p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myDblClick (branch) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branch.getId());</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onDblClick"</span> : myDblClick</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">setOnEdit()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
			</table>
			<p>Active l'édition des branches. Méthode qui est appelée lorsqu'on fini d'éditer une branche (concrétement, lors du blur du champ texte). Le contenu de la branche sera celui que la fonction utilisateur retournera.</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myEdit (branch, newValue, oldValue) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">var</span> str = branch.getId() + <span class="string">" : "</span> + newValue;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> str;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onEdit"</span> : myEdit</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Lorsqu'on a une fonction assignée en double-clic <em>(tree.setOnDblClick())</em>, l'utilisation du onEdit disparaît. C'est soit l'un, soit l'autre</li>
			</ul>
			</div>

			<h4 onclick="shownext(this)">setOnBeforeCheck()</h4>

			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>
					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée lorsqu'on check ou uncheck la branche, juste avant qu'elle change de status. Pour ne pas changer son status, il faut retourner <strong>false</strong></p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myBeforeCheck (branch, status) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">var</span> strNow = (status) ? <span class="string">"checkée"</span> : <span class="string">"uncheckée"</span>;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">var</span> strNext = (status) ? <span class="string">"uncheckée"</span> : <span class="string">"checkée"</span>;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branch.getId() + <span class="string">" est actuellement "</span> + strNow +</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">" et sera "</span> + strNext +</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">" si cette fonction retourne <span class="reserved">true</span>"</span>);</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> <span class="reserved">true</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onBeforeCheck"</span> : myBeforeCheck</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 onclick="shownext(this)">setOnCheck()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode qui est appelée lorsqu'on check ou uncheck la branche</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myCheck (branch, status) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">var</span> str = (status) ? <span class="string">"checkée"</span> : <span class="string">"uncheckée"</span>;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branch.getId() + <span class="string">" est maintenant "</span> + str);</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onCheck"</span> : myCheck</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">setOnDrop()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
			</table>
			<p>Active le drag&dorp. Méthode qui est appelée lorsqu'on drop la branche. On peut faire un "drop as sibling (frère)" en gardant la touche <strong>ALT</strong> appuyée. Il est également possible de faire un "copydrag" en maintenant la touche <strong>CONTROL</strong> appuyée.</p>
			<p>La méthode est appelée deux fois. Une fois avant que le drop soit fait (drop_finished = false) et une fois après que le drop soit fait (drop_finished = true), pour autant qu'il n'y ait pas eu d'erreurs avant.</p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myDrop (branchMoved, newParent, dropFinished) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">if</span> (!dropFinished) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(branchMoved.getId() + <span class="string">" sera fille de "</span></p></td></tr><tr><td><p style="padding-left:16ex;">+ newParent.getId());</p></td></tr><tr><td><p style="padding-left:8ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(branchMoved.getId() + <span class="string">" est maintenant fille de "</span></p></td></tr><tr><td><p style="padding-left:16ex;">+ newParent.getId());</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onDrop"</span> : myDrop</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Maintenir ALT pour dropper "as sibling"</li>
				<li>Maintenir CONTROL pour faire un "copydrag"</li>
			</ul>
			</div>

			<h4 class="new" onclick="shownext(this)">setOnDropAjax()</h4>

			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>
					<td>La méthode à appeler</td></tr>
				<tr><th>link <em>(string)</em></th>

					<td>Le lien vers la page de traitement coté serveur</td></tr>
			</table>
			<p>Active le drag&dorp. Méthode qui est appelée lorsqu'on drop la branche et qui envoie du même coup une requête Ajax. On peut faire un "drop as sibling (frère)" en gardant la touche <strong>ALT</strong> appuyée. Il est également possible de faire un "copydrag" en maintenant la touche <strong>CONTROL</strong> appuyée. Pour d'autres exemples, voir <a href="#ondropajax">Drop Ajax </a></p>

			<p>La méthode est appelée deux fois. Une fois avant que le drop soit fait (drop_finished = false) et une fois après que le drop soit fait (drop_finished = true), pour autant qu'il n'y ait pas eu d'erreurs avant.</p>
			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr><tr><th>31</th></tr><tr><th>32</th></tr><tr><th>33</th></tr><tr><th>34</th></tr><tr><th>35</th></tr><tr><th>36</th></tr><tr><th>37</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myDrop(branchMoved,newParent,response,dropFinished){</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// On check avant que le drop soit fait</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">if</span> (!dropFinished) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="comment">// La réponse correspond au responseText de</span></p></td></tr><tr><td><p style="padding-left:12ex;"><span class="comment">// l'objet XMLHttpRequest</span></p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(response);</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="comment">// Il peut tout-à-fait s'agir d"une string JSON,</span></p></td></tr><tr><td><p style="padding-left:12ex;"><span class="comment">// auquel cas on peut l'évaluer comme ceci :</span></p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">var</span> obj = eval(<span class="string">"("</span> + response + <span class="string">")"</span>);</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(obj.myProperty);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(branchMoved.getId() + <span class="string">" sera fille de "</span> +</p></td></tr><tr><td><p style="padding-left:16ex;">newParent.getId() +</p></td></tr><tr><td><p style="padding-left:16ex;"><span class="string">" si cette fonction retourne <span class="reserved">true</span>"</span>);</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">return</span> <span class="reserved">true</span>;</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onDropAjax"</span> : [myDrop, <span class="string">"pageScript.php"</span>]</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// Exemple de fichier PHP coté serveur</span></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="php">&lt;?php</span></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// On fait divers traitements</span></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// ...</span></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// Et on affiche une string JSON</span></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="php">?&gt;</span></p></td></tr><tr><td><p style="padding-left:0ex;">({</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="string">"myProperty"</span> : <span class="string">"myValue"</span>,</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="string">"other"</span> : [<span class="string">"this"</span>, <span class="string">"is"</span>, <span class="string">"an"</span>, <span class="string">"array"</span>]</p></td></tr><tr><td><p style="padding-left:0ex;">})</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>Maintenir ALT pour dropper "as sibling"</li>
				<li>Maintenir CONTROL pour faire un "copydrag"</li>
				<li>Les variables envoyées à la page <a href="#droplink">droplink</a> passent par la méthode POST</li>

				<li>Ces variables sont :
					<ul>
						<li>" drag " = description JSON de la branche qui a bougé</li>
						<li>" drop " = description JSON de la branche sur laquelle on a déposé le drag</li>
						<li>" drag_id " = id de la branche qui a bougé</li>
						<li>" drop_id " = id de la branche sur laquelle on a déposé le drag_id</li>
						<li>" treedrag_id " = id de l'arbre d'où est tiré la branche qui a bougé</li>

						<li>" treedrop_id " = id de l'arbre qui accueille la branche qui a bougé</li>
						<li>" sibling " = 0 si on le drop est comme fils, 1 s'il est comme frère</li>
					</ul>
				</li>
				<li>Toutes autres variables passée par <a href="#droplink">droplink</a> sont également transmises en POST. Par exemple, si droplink = "page.php?spec=1", on récuperera <em>spec</em> en POST malgré tout.</li>

			</ul>
			</div>

			<h4 onclick="shownext(this)">setOnOpenPopulate()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
				<tr><th>link <em>(string)</em></th>
					<td>Le lien vers la page de traitement coté serveur</td></tr>
			</table>
			<p>Active la remplissage des enfants au moment de l'ouverture de la branche. Méthode qui est appelée lorsqu'on ouvre la branche et qui envoie du même coup une requête Ajax. Pour d'autres exemples, voir <a href="#onopenpopulate">onopenpopulate</a></p>
			<h4>Exemples</h4>

			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr><tr><th>31</th></tr><tr><th>32</th></tr><tr><th>33</th></tr><tr><th>34</th></tr><tr><th>35</th></tr><tr><th>36</th></tr><tr><th>37</th></tr><tr><th>38</th></tr><tr><th>39</th></tr><tr><th>40</th></tr><tr><th>41</th></tr><tr><th>42</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Fonction utilisateur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myOpen (branch, response) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// La réponse correspond au responseText de</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// l'objet XMLHttpRequest</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(response);</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// Il DOIT string JSON, qui DOIT être structurée</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// à la façon d'une TafelTreeBranch</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">var</span> childBranch = eval(response);</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(childBranch.id + <span class="string">"\n"</span> + childBranch.txt);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">alert</span>(branch.getId() + <span class="string">" sera ouverte si cette "</span> +</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="string">"fonction retourne <span class="reserved">true</span>"</span>);</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> response;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> tree = <span class="reserved">new</span> TafelTree (<span class="string">"idtree"</span>, {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"generate"</span> : <span class="reserved">true</span>,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"onOpenPopulate"</span> : [myOpen, <span class="string">"pageScript.php"</span>]</p></td></tr><tr><td><p style="padding-left:4ex;">});</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;!-- Exemple de fichier PHP coté serveur --></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="php">&lt;?php</span></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// On fait divers traitements</span></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// ...</span></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// Et on affiche une string JSON. A noter qu'on retourne</span></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="comment">// systématiquement un TABLEAU</span></p></td></tr><tr><td><p style="padding-left:0ex;"><span class="php">?&gt;</span></p></td></tr><tr><td><p style="padding-left:0ex;">[</p></td></tr><tr><td><p style="padding-left:0ex;">{</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="string">"id"</span> : <span class="string">"child1"</span>,</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="string">"txt"</span> : <span class="string">"Texte 1"</span>,</p></td></tr><tr><td><p style="padding-left:0ex;"><span class="string">"items"</span> : [</p></td></tr><tr><td><p style="padding-left:4ex;">{</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"id"</span> : <span class="string">"child2"</span>,</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="string">"txt"</span> : <span class="string">"Texte 2"</span></p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">]</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">]</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>La fonction utilisateur DOIT retourner une string JSON représentant des TafelTreeBranch. Ou false pour annuler l'ouverture.</li>
				<li>Le JSON DOIT ETRE entre parenthèses <strong>( )</strong></li>
				<li>Les variables envoyées à la page <a href="#openlink">openlink</a> passent par la méthode POST</li>

				<li>Ces variables sont :
					<ul>
						<li>" branch " = description JSON de la branche</li>
						<li>" branch_id " = id de la branche qui s'ouvre</li>
						<li>" tree_id " = id de l'arbre qui accueille la branche qui s'ouvre</li>
					</ul>
				</li>
				<li>Toutes autres variables passée par <a href="#openlink">openlink</a> sont également transmises en POST. Par exemple, si openlink = "page.php?spec=1", on récuperera <em>spec</em> en POST malgré tout.</li>

			</ul>
			</div>

			<h4 onclick="shownext(this)">setOnEditAjax()</h4>
			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>

					<td>La méthode à appeler</td></tr>
				<tr><th>link <em>(string)</em></th>
					<td>Le lien vers la page de traitement coté serveur</td></tr>
			</table>
			<p>Méthode appelée après l'édition de la branche. Lorsque celle-ci a terminé d'être éditée, elle lance une requête Ajax à la page <strong>editlink</strong> et renvoie le retour Ajax à la méthode utilisateur. <strong>La méthode doit retourner une string représentant la nouvelle valeur de la branche</strong>. Prend le pas sur la méthode <strong><a href="#setOnEditAjax">setOnEditAjax()</a></strong> de TafelTree</p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr><tr><th>27</th></tr><tr><th>28</th></tr><tr><th>29</th></tr><tr><th>30</th></tr><tr><th>31</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myEditAjax (branch, response, oldValue) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Pour voir le contenu de la réponse, on peut en faire une</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"<span class="reserved">alert</span>"</span> ou le mettre dans le DIV de debug comme ceci :</span></p></td></tr><tr><td><p style="padding-left:4ex;">branch.tree.debug(response);</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On peut aussi évaluer la réponse en tant qu'objet JSON</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// (à noter qu'elle est entre parenthèses). La réponse</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// doit contenir, d<span class="string">'une manière ou d'</span>une autre, la</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// nouvelle valeur de la branche</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// ({</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"message"</span> : <span class="string">"Tout est ok sur le serveur"</span>,</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"newValue"</span> : <span class="string">"Nouvelle valeur de la branche"</span>,</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="string">"anyOtherParams"</span> : <span class="reserved">true</span></span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// })</span></p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// On peut aussi retourner seulement la nouvelle valeur</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// (dans ce cas, plus besoin de parenthèses)</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// <span class="reserved">alert</span> (response); // show the <span class="reserved">new</span> text</span></p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Tests divers</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">if</span> (resultsFromTest) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// OK, la branche sera éditée et aura la</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// nouvelle valeur retournée par cette fonction</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> theNewValue;</p></td></tr><tr><td><p style="padding-left:4ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// Ici, la branche ne sera pas éditée et conservera</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// son ancienne valeur (oldValue)</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">return</span> <span class="reserved">false</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>La réponse devrait contenir la nouvelle valeur à insérer dans la branche</li>
				<li>Les variables envoyées à la page <a href="#editlink">editlink</a> passent par la méthode POST</li>
				<li>Ces variables sont :
					<ul>

						<li>" branch " = description JSON de la branche</li>
						<li>" branch_id " = id de la branche qui s'ouvreé</li>
						<li>" tree_id " = id de l'arbre d'où est tiré la branche qui s'ouvre</li>
						<li>" new_value " = la nouvelle valeur de la branche</li>
						<li>" old_value " = l'ancienne valeur de la branche</li>
					</ul>

				</li>
				<li>Toutes autres variables passée par <a href="#editlink">editlink</a> sont également transmises en POST. Par exemple, si openlink = "page.php?spec=1", on récuperera <em>spec</em> en POST malgré tout.</li>
			</ul>
			</div>

			<h4 class="new" onclick="shownext(this)">setOnErrorAjax()</h4>

			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr><th>func <em>(function)</em></th>
					<td>La méthode à appeler</td></tr>
			</table>
			<p>Méthode appelée suite à une erreur dans une requête Ajax de drop, open ou edit</p>

			<h4>Exemples</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;"><span class="reserved">function</span> myErrorAjax (type, response, branch, droppedOn) {</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Vérifie le type d'erreur. Peue être drop, edit ou open</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">switch</span> (type) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">case</span> <span class="string">"drop"</span> :</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">break</span>;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">case</span> <span class="string">"open"</span> :</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">break</span>;</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">case</span> <span class="string">"edit"</span> :</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">break</span>;</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">alert</span>(<span class="string">"Une erreur est survenue pendant l'édition"</span>);</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">break</span>;</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">}</p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h1>Méthodes TafelTreeManager</h1>
			<h2>Description des événements clavier</h2>
			<h4 class="new" onclick="shownext(this)">Events</h4>
			<div class="develop">
			<p>Les touches suivantes sont gérées :</p>

			<ul>
				<li>ARROW_LEFT</li>
				<li>ARROW_RIGHT</li>
				<li>ARROW_UP</li>
				<li>ARROW_DOWN</li>
				<li>HOME</li>

				<li>END</li>
				<li>F2 (édition)</li>
				<li>ENTER (stop de l'édition)</li>
				<li>ESCAPE (déselection)</li>
				<li>DELETE</li>
				<li>CTRL + X (touche POMME sur mac Safari)</li>

				<li>CTRL + C (touche POMME sur mac Safari)</li>
				<li>CTRL + V (touche POMME sur mac Safari)</li>
			</ul>
			<p>Il est possible de désactiver certaines touches ou d'ajouter ses propres touches. Voir la fonction setKey()</p>
			</div>
			<h2>Méthodes TafelTreeManager publiques</h2>
			<h4 class="new" onclick="shownext(this)">setKeys()</h4>

			<div class="develop">
			<h4>Paramètres</h4>
			<table class="prop">
				<tr>
					<th>keys <em>(array)</em></th>
					<td>Le tableau contenant les informations des code touche et la fonction approrpiée</td>
				</tr>

			</table>
			<p>Permet de gérer un ou plusieurs comportements pour une touche donnée. Concrétement, la fonction associée à la touche est
			appelée dès que la touche est appuyée. Cette fonction contient les données d'environnement (l'arbre sur lequel se passe
			l'action, les touches appuyées (ctrl, alt, shift ou meta) etc).</p>
			<h4>Exemple</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr><tr><th>5</th></tr><tr><th>6</th></tr><tr><th>7</th></tr><tr><th>8</th></tr><tr><th>9</th></tr><tr><th>10</th></tr><tr><th>11</th></tr><tr><th>12</th></tr><tr><th>13</th></tr><tr><th>14</th></tr><tr><th>15</th></tr><tr><th>16</th></tr><tr><th>17</th></tr><tr><th>18</th></tr><tr><th>19</th></tr><tr><th>20</th></tr><tr><th>21</th></tr><tr><th>22</th></tr><tr><th>23</th></tr><tr><th>24</th></tr><tr><th>25</th></tr><tr><th>26</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Définition de la fonction pour la touche n°46 (DEL)</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">function</span> myOnDelete (tree, code, modifiers, ev) {</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// Là, il s<span class="string">'agit de faire se qu'</span>on veut et retourner</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// <span class="string">"<span class="reserved">true</span>"</span> si on veut que le process continue. Par</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// exemple, pour la touche DEL, il y a déjà une</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// fonction intégrée. Si on retourne <span class="string">"<span class="reserved">true</span>"</span>, cette</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// fonction sera appelée. Si on retourne <span class="string">"<span class="reserved">false</span>"</span>, elle</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="comment">// ne sera pas appelée...</span></p></td></tr><tr><td><p style="padding-left:8ex;"><span class="reserved">if</span> (okForDelete) {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">return</span> <span class="reserved">true</span>;</p></td></tr><tr><td><p style="padding-left:8ex;">} <span class="reserved">else</span> {</p></td></tr><tr><td><p style="padding-left:12ex;"><span class="reserved">return</span> <span class="reserved">false</span>;</p></td></tr><tr><td><p style="padding-left:8ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:0ex;">&nbsp;</p></td></tr><tr><td><p style="padding-left:4ex;"><span class="comment">// Définition des touches</span></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">var</span> keys = [</p></td></tr><tr><td><p style="padding-left:4ex;">{</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"key"</span> : 46,</p></td></tr><tr><td><p style="padding-left:8ex;"><span class="string">"func"</span> : myOnDelete</p></td></tr><tr><td><p style="padding-left:4ex;">}</p></td></tr><tr><td><p style="padding-left:4ex;">];</p></td></tr><tr><td><p style="padding-left:4ex;">TafelTreeManager.setKeys(keys);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			<h4>Notes</h4>
			<ul>
				<li>modifiers.ctrlKey = true si Ctrl est appuyé</li>
				<li>modifiers.altKey = true si Alt est appuyé</li>
				<li>modifiers.shiftKey = true si Shift est appuyé</li>
				<li>modifiers.metaKey = true si "Pomme" (sous mac Safari) est appuyé</li>

			</ul>
			</div>

			<h4 class="new" onclick="shownext(this)">disableKeyboardEvents()</h4>
			<div class="develop">
			<p>Désactive la gestion clavier</p>
			<h4>Exemple</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;">TafelTreeManager.disableKeyboardEvents();</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">disableKeyboardStructuralEvents()</h4>
			<div class="develop">
			<p>Désactive la gestion clavier pour ce qui est changement de structure. Il est donc possible de se déplacer avec les
			flèches mais pas de copier-coller ou supprimer, par exemple.</p>
			<h4>Exemple</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;">TafelTreeManager.disableKeyboardStructuralEvents();</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">getCurrentTree()</h4>
			<div class="develop">
			<p>Retourne l'arbre courant sur lequel se passe les actions. Null si aucun arbre n'est courant.</p>
			<h4>Exemple</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;"><span class="reserved">alert</span>(TafelTreeManager.getCurrentTree());</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			<h4 class="new" onclick="shownext(this)">setCurrentTree()</h4>
			<div class="develop">
			<p>Set l'arbre courant sur lequel va se passer les actions</p>
			<h4>Exemple</h4>
			<div class="code"><table><tr><td class="num"><table><tr><th>1</th></tr><tr><th>2</th></tr><tr><th>3</th></tr><tr><th>4</th></tr></table></td><td><table><tr><td><p style="padding-left:0ex;">&lt;script type=<span class="string">"text/javascript"</span>></p></td></tr><tr><td><p style="padding-left:4ex;">TafelTreeManager.setCurrentTree(myTree);</p></td></tr><tr><td><p style="padding-left:0ex;">&lt;/script></p></td></tr><tr><td>&nbsp;</td></tr></table></td></tr></table></div>

			</div>

			</div>

		</div>
	</div>
	<div class="bottom">
		<p>Treeview JS TafelTree</p>
		<p>2006-12-30, <a href="#" onClick="gereStyle()">Tafel</a>. Optimisé pour Mozilla Firefox</p>

	</div>
</div>

</body>
</html>
Return current item: TafelTree view javascript