Inicio Explorar Ayuda
Iniciar sesión
zhxd2
/
tripal
1
0
Fork 0
Archivos Incidencias 0 Pull Requests 0 Wiki
Árbol: ddbee459ef
Ramas Etiquetas
tripal
/
theme_tripal
/
js
/
jsTree
/
reference
/
_documentation
/
4_data.html

4_data.html 11 KB
Histórico Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198 
  1. <!DOCTYPE html
    2. 

  2. PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    3. 

  3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    4. 

  4. <html xmlns="http://www.w3.org/1999/xhtml">
    5. 

  5. <head>
    6. 

  6. 	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    7. 

  7. 	<title>jsTree &raquo; Documentation </title>
    8. 

  8. 	<link rel="stylesheet" type="text/css" href="../media/style.css" />
    9. 

  9. 

  10. 	<link rel="shortcut icon" href="../media/favicon.ico" />
    11. 

  11. 

  12. 	<link rel="stylesheet" type="text/css" href="../media/prettify.css" />
    13. 

  13. 	<script type="text/javascript" src="../media/prettify.js"></script>
    14. 

  14. 	<script type="text/javascript" src="../media/iepngfix_tilebg.js"></script>  
    15. 

  15. 	<script type="text/javascript">window.onload = function() { prettyPrint(); }</script>  
    16. 

  16. </head>
    17. 

  17. <body>
    18. 

  18. 	<div id="container">
    19. 

  19. 		<div id="head">
    20. 

  20. 			<h1>jsTree</h1>
    21. 

  21. 			<h2>javascript tree component</h2>
    22. 

  22. 			<h3>Documentation</h3>
    23. 

  23. 		</div>
    24. 

  24. 

  25. 		<div id="sidebar">
    26. 

  26. 			<h3 style="margin-top:0;">Documentation</h3>
    27. 

  27. 			<ul>
    28. 

  28. 				<li class="page_item"><a href="1_files.html" title="Required &amp; optional files">Required &#038; optional files</a></li>
    29. 

  29. 				<li class="page_item"><a href="2_creation.html" title="Instance creation">Instance creation</a></li>
    30. 

  30. 				<li class="page_item"><a href="3_configuration.html" title="Configuration">Configuration</a></li>
    31. 

  31. 				<li class="page_item current_page_item"><a href="4_data.html" title="Data sources">Data sources</a></li>
    32. 

  32. 				<li class="page_item"><a href="5_customize.html" title="Customization">Customization</a></li>
    33. 

  33. 				<li class="page_item"><a href="6_output.html" title="Output">Output</a></li>
    34. 

  34. 				<li class="page_item"><a href="7_api.html" title="API">API&nbsp;</a></li>
    35. 

  35. 			</ul>
    36. 

  36. 			<h3>Examples</h3>
    37. 

  37. 			<ul>
    38. 

  38. 				<li class="page_item"><a href="../_examples/1_datasources.html" title="Data sources">Data sources</a></li>
    39. 

  39. 				<li class="page_item"><a href="../_examples/2_operations.html" title="Operations">Operations</a></li>
    40. 

  40. 				<li class="page_item"><a href="../_examples/3_callbacks.html" title="Callbacks">Callbacks</a></li>
    41. 

  41. 				<li class="page_item"><a href="../_examples/4_themes.html" title="Themes">Themes</a></li>
    42. 

  42. 				<li class="page_item"><a href="../_examples/5_others.html" title="Others">Other examples</a></li>
    43. 

  43. 				<li class="page_item important"><a href="../_examples/7_full.html" title="Full example">Full PHP &amp; mySQL example&nbsp;</a></li>
    44. 

  44. 			</ul>
    45. 

  45. 		</div>
    46. 

  46. 		<div id="data" style="margin-top:-45px;">
    47. 

  47. 			<div id="content">
    48. 

  48. 				<ul class='nav'>
    49. 

  49. 					<li><a href="3_configuration.html" title="Configuration">&laquo;&nbsp;Configuration</a></li>
    50. 

  50. 					<li><a href="../index.html">Up to Reference</a></li>
    51. 

  51. 					<li><a href="5_customize.html" title="Customization">Customization&nbsp;&raquo;</a></li>
    52. 

  52. 				</ul>
    53. 

  53. 				<h2 style="margin-top:25px;">Data sources</h2>
    54. 

  54. 				<div class="entry"><div id="documentation">
    55. 

  55. 

  56. <h2>Predefined HTML</h2>
    57. 

  57. <div class="source">without language versions</div>
    58. 

  58. <pre>&lt;!-- SINGLE NODE --&gt;
    59. 

  59. &lt;li id=&quot;<em>node_identificator</em>&quot;&gt;
    60. 

  60. 	&lt;a href=&quot;#&quot;&gt;<em>node_title</em>&lt;/a&gt;
    61. 

  61. &lt;/li&gt;
    62. 

  62. 

  63. &lt;!-- NODE WITH CHILDREN --&gt;
    64. 

  64. &lt;li id=&quot;<em>node_identificator</em>&quot;&gt;
    65. 

  65. 	&lt;a href=&quot;#&quot;&gt;<em>node_title</em>&lt;/a&gt;
    66. 

  66. 	&lt;ul&gt;
    67. 

  67. 		&lt;!-- CHILD NODES --&gt;
    68. 

  68. 	&lt;/ul&gt;
    69. 

  69. &lt;/li&gt;
    70. 

  70. </pre>
    71. 

  71. <div class="source">with language versions</div>
    72. 

  72. <pre>&lt;!-- SINGLE NODE --&gt;
    73. 

  73. &lt;li id=&quot;<em>node_identificator</em>&quot;&gt;
    74. 

  74. 	&lt;a href=&quot;#&quot; class=&quot;<em>language_name</em>&quot;&gt;<em>node_title</em>&lt;/a&gt;
    75. 

  75. 	&lt;a href=&quot;#&quot; class=&quot;<em>language_name</em>&quot;&gt;<em>node_title</em>&lt;/a&gt;
    76. 

  76. &lt;/li&gt;
    77. 

  77. 

  78. &lt;!-- NODE WITH CHILDREN --&gt;
    79. 

  79. &lt;li id=&quot;<em>node_identificator</em>&quot;&gt;
    80. 

  80. 	&lt;a href=&quot;#&quot; class=&quot;<em>language_name</em>&quot;&gt;<em>node_title</em>&lt;/a&gt;
    81. 

  81. 	&lt;a href=&quot;#&quot; class=&quot;<em>language_name</em>&quot;&gt;<em>node_title</em>&lt;/a&gt;
    82. 

  82. 	&lt;ul&gt;
    83. 

  83. 		&lt;!-- CHILD NODES --&gt;
    84. 

  84. 	&lt;/ul&gt;
    85. 

  85. &lt;/li&gt;
    86. 

  86. </pre>
    87. 

  87. <p class="note">NOTE: if you wish to set a custom icon for a node just use the <span class="var">background-image</span> style property (on the <span class="var">&lt;a&gt;</span> node).</p>
    88. 

  88. 

  89. <h2>Nested XML</h2>
    90. 

  90. <div class="source">WITHOUT language versions</div>
    91. 

  91. <pre>&lt;xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot; ?&gt;
    92. 

  92. &lt;root&gt;
    93. 

  93. 	&lt;item id=&quot;<em>node_id</em>&quot; [state=&quot;<em>closed|open</em>&quot; <em>hasChildren</em>]&gt;
    94. 

  94. 		&lt;content&gt;
    95. 

  95. 			&lt;name [icon=&quot;<em>path_to_icon</em>&quot;]&gt;&lt;![CDATA[<em>node_title</em>]]&gt;&lt;/name&gt;
    96. 

  96. 		&lt;/content&gt;
    97. 

  97. 		&lt;!-- NESTED ITEM NODES --&gt;
    98. 

  98. 	&lt;/item&gt;
    99. 

  99. &lt;/root&gt;
    100. 

  100. </pre>
    101. 

  101. <div class="source">WITH language versions</div>
    102. 

  102. <pre>&lt;xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot; ?&gt;
    103. 

  103. &lt;root&gt;
    104. 

  104. 	&lt;item id=&quot;<em>node_id</em>&quot; [state=&quot;<em>closed|open</em>&quot; <em>hasChildren</em>]&gt;
    105. 

  105. 		&lt;content&gt;
    106. 

  106. 			&lt;name lang=&quot;<em>language_name</em>&quot; [icon=&quot;<em>path_to_icon</em>&quot;]&gt;
    107. 

  107. 				&lt;![CDATA[<em>node_title</em>]]&gt;
    108. 

  108. 			&lt;/name&gt;
    109. 

  109. 			&lt;name lang=&quot;<em>language_name</em>&quot; [icon=&quot;<em>path_to_icon</em>&quot;]&gt;
    110. 

  110. 				&lt;![CDATA[<em>node_title</em>]]&gt;
    111. 

  111. 			&lt;/name&gt;
    112. 

  112. 		&lt;/content&gt;
    113. 

  113. 		&lt;!-- NESTED ITEM NODES --&gt;
    114. 

  114. 	&lt;/item&gt;
    115. 

  115. &lt;/root&gt;
    116. 

  116. </pre>
    117. 

  117. <p class="note">NOTE:</p>
    118. 

  118. <ul class="note">
    119. 

  119. 	<li>if the <span class="var">icon</span> attribute (if set) does not contain a <span class="val">"/"</span> the icon is looked up in the current theme directory (so if the icon is in the same folder as the file displaying the tree use <span class="val">"./"</span>)</li>
    120. 

  120. 	<li>if the <span class="var">state</span> attribute is present the node is forced in the specified state</li>
    121. 

  121. 	<li>if the <span class="var">hasChildren</span> attribute is present, the output node is displayed as having children even if it does not (useful for <span class="var">async</span>)</li>
    122. 

  122. 	<li>all other attributes of the <span class="var">item</span> node get copied to the <span class="var">&lt;li&gt;</span> node in the output HTML (for example <span class="var">title</span> or <span class="var">rel</span>)</li>
    123. 

  123. 	<li>all attributes (except <span class="var">language</span> and <span class="var">icon</span>) of the <span class="var">name</span> node get copied to the <span class="var">&lt;a&gt;</span> node in the output HTML (for example <span class="var">href</span>)</li>
    124. 

  124. </ul>
    125. 

  125. 

  126. <h2>Flat XML</h2>
    127. 

  127. <div class="source">WITHOUT language versions</div>
    128. 

  128. <pre>&lt;xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot; ?&gt;
    129. 

  129. &lt;root&gt;
    130. 

  130. 	&lt;item id=&quot;<em>node_id</em>&quot; parent_id=&quot;<em>parent_node_id</em>&quot; [state=&quot;<em>closed|open</em>&quot; <em>hasChildren</em>]&gt;
    131. 

  131. 		&lt;content&gt;
    132. 

  132. 			&lt;name [icon=&quot;<em>path_to_icon</em>&quot;]&gt;&lt;![CDATA[<em>node_title</em>]]&gt;&lt;/name&gt;
    133. 

  133. 		&lt;/content&gt;
    134. 

  134. 	&lt;/item&gt;
    135. 

  135. 	&lt;!-- NEXT ITEM NODES --&gt;
    136. 

  136. &lt;/root&gt;
    137. 

  137. </pre>
    138. 

  138. <div class="source">WITH language versions</div>
    139. 

  139. <pre>&lt;xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot; ?&gt;
    140. 

  140. &lt;root&gt;
    141. 

  141. 	&lt;item id=&quot;<em>node_id</em>&quot; parent_id=&quot;<em>parent_node_id</em>&quot; [state=&quot;<em>closed|open</em>&quot; <em>hasChildren</em>]&gt;
    142. 

  142. 		&lt;content&gt;
    143. 

  143. 			&lt;name lang=&quot;<em>language_name</em>&quot; [icon=&quot;<em>path_to_icon</em>&quot;]&gt;
    144. 

  144. 				&lt;![CDATA[<em>node_title</em>]]&gt;
    145. 

  145. 			&lt;/name&gt;
    146. 

  146. 			&lt;name lang=&quot;<em>language_name</em>&quot; [icon=&quot;<em>path_to_icon</em>&quot;]&gt;
    147. 

  147. 				&lt;![CDATA[<em>node_title</em>]]&gt;
    148. 

  148. 			&lt;/name&gt;
    149. 

  149. 		&lt;/content&gt;
    150. 

  150. 	&lt;/item&gt;
    151. 

  151. 	&lt;!-- NEXT ITEM NODES --&gt;
    152. 

  152. &lt;/root&gt;
    153. 

  153. </pre>
    154. 

  154. <p class="note">NOTE:</p>
    155. 

  155. <ul class="note">
    156. 

  156. 	<li>in <span class="var">async</span> mode, do not set the <span class="var">parent_id</span> attribute</li>
    157. 

  157. 	<li>if the <span class="var">icon</span> attribute (if set) does not contain a <span class="val">"/"</span> the icon is looked up in the current theme directory (so if the icon is in the same folder as the file displaying the tree use <span class="val">"./"</span>)</li>
    158. 

  158. 	<li>if the <span class="var">state</span> attribute is present the node is forced in the specified state</li>
    159. 

  159. 	<li>if the <span class="var">hasChildren</span> attribute is present, the output node is displayed as having children even if it does not (useful for <span class="var">async</span>)</li>
    160. 

  160. 	<li>all other attributes of the <span class="var">item</span> node get copied to the <span class="var">&lt;li&gt;</span> node in the output HTML (for example <span class="var">title</span> or <span class="var">rel</span>)</li>
    161. 

  161. 	<li>all attributes (except <span class="var">language</span> and <span class="var">icon</span>) of the <span class="var">name</span> node get copied to the <span class="var">&lt;a&gt;</span> node in the output HTML (for example <span class="var">href</span>)</li>
    162. 

  162. </ul>
    163. 

  163. 

  164. <h2>JSON</h2>
    165. 

  165. <div class="source">WITHOUT language versions</div>
    166. 

  166. <pre>{ 
    167. 

  167. 	attributes: { id : &quot;<em>node_identificator</em>&quot;, [<em>attribute</em> : &quot;<em>attribute_value</em>&quot;] }, 
    168. 

  168. 	state: &quot;closed&quot; or &quot;open&quot;, 
    169. 

  169. 	data: &quot;<em>node_title</em>&quot;, 
    170. 

  170. 	children: [ // an array of child nodes objects ]
    171. 

  171. }
    172. 

  172. // data can also be in the form
    173. 

  173. data : { title : &quot;<em>node_title</em>&quot;, icon : &quot;<em>path_to_icon</em>&quot;, attributes : {&quot;<em>key</em>&quot; : &quot;<em>value</em>&quot;, ... } }
    174. 

  174. </pre>
    175. 

  175. <div class="source">WITH language versions</div>
    176. 

  176. <pre>{ 
    177. 

  177. 	attributes: { id : &quot;<em>node_identificator</em>&quot;, [<em>attribute</em> : &quot;<em>attribute_value</em>&quot;] }, 
    178. 

  178. 	state: &quot;closed&quot; or &quot;open&quot;, 
    179. 

  179. 	data: { &quot;language_name&quot; : &quot;<em>node_title</em>&quot;, &quot;language_name&quot; : &quot;<em>node_title</em>&quot;, ... }, 
    180. 

  180. 	children: [ // an array of child nodes objects ]
    181. 

  181. }
    182. 

  182. // each item in the data object can also be in the form
    183. 

  183. &quot;language&quot; : { title : &quot;<em>node_title</em>&quot;, icon : &quot;<em>path_to_icon</em>&quot;, attributes : {&quot;<em>key</em>&quot; : &quot;<em>value</em>&quot;, ... } }
    184. 

  184. </pre>
    185. 

  185. <p class="note">NOTE:</p>
    186. 

  186. <ul class="note">
    187. 

  187. 	<li>if <span class="var">path_to_icon</span> (if set) does not contain a <span class="val">"/"</span> the icon is looked up in the current theme directory (so if the icon is in the same folder as the file displaying the tree use <span class="val">"./"</span>)</li>
    188. 

  188. 	<li>if the <span class="var">state</span> property is present the node is forced in the specified state</li>
    189. 

  189. 	<li>all members of the <span class="var">attributes</span> object node get copied to the <span class="var">&lt;li&gt;</span> node in the output HTML as attributes (for example <span class="var">title</span> or <span class="var">rel</span>)</li>
    190. 

  190. 	<li>all <span class="var">attributes</span> in any <span class="var">data</span> object get copied to the <span class="var">&lt;a&gt;</span> node</li>
    191. 

  191. </ul>
    192. 

  192. 

  193. 				</div></div>
    194. 

  194. 			</div>
    195. 

  195. 		</div>
    196. 

  196. 	</div>
    197. 

  197. </body>
    198. 

  198. </html>
    199.