1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
7 <meta http-equiv="content-type" content="text/html; charset=undefined" />
8 <meta name="generator" content="JsDoc Toolkit" />
11 <title>JsDoc Reference - Roo.JsonView</title>
14 <link rel="stylesheet" type="text/css" href="../../css/roojs.css" />
15 <link rel="stylesheet" type="text/css" href="../default.css" />
18 <script type="text/javascript" src="../page.js">
25 <body onload="RooDocsPage.onload();">
28 <div class="body-wrap">
30 <!-- ============================== links to methods. ================================= -->
32 <div class="top-tools">
34 <a class="inner-link" href="#Roo.JsonView-props"><img src="resources/s.gif" class="item-icon icon-prop">Properties</a>
35 <a class="inner-link" href="#Roo.JsonView-methods"><img src="resources/s.gif" class="item-icon icon-method">Methods</a>
36 <a class="inner-link" href="#Roo.JsonView-events"><img src="resources/s.gif" class="item-icon icon-event">Events</a>
37 <a class="inner-link" href="#Roo.JsonView-configs"><img src="resources/s.gif" class="item-icon icon-config">Config Options</a>
38 <a class="bookmark" href="NEED_TO_CREATE_DIRECT_LINK_HREF"><img src="resources/s.gif" class="item-icon icon-fav">Direct Link</a>
43 <!-- ============================== inheritance Block. ================================= -->
45 <div class="inheritance res-block">
46 <pre class="res-block-inner"><a href="./Roo.View.html#constructor" roo:cls="Roo.View.html#constructor">Roo.View</a>
47 <img src="../../images/default/s.gif" height="1" width="20"/><img class="elbow" src="../../images/default/tree/elbow-end.gif"/>Roo.JsonView
52 <!-- ============================== class title / details ============================ -->
55 <h1 class="classTitle">
60 <table cellspacing="0" class="class-summary-table">
62 <tr><td class="label">Package:</td><td class="hd-info">Roo</td></tr>
64 <tr><td class="label">Defined In:</td><td class="hd-info">
66 <a href="./src/Roo_JsonView.js.html">Roo/JsonView.js</a>.
69 <tr><td class="label">Class:</td><td class="hd-info">JsonView</td></tr>
74 <tr><td class="label">Extends:</td><td class="hd-info">
75 <a href="./Roo.View.html#constructor" roo:cls="Roo.View.html#constructor">Roo.View</a>
83 <!-- ============================== class summary ========================== -->
84 <div class="description">
85 Shortcut class to create a JSON + {<b>link</b> Roo.UpdateManager} template view. Usage:<br/><pre><code><br/>var view = new Roo.JsonView("my-element",<br/> '<div id="{id}">{foo} - {bar}</div>', // auto create template<br/> { multiSelect: true, jsonRoot: "data" }<br/>);<br/><br/>// listen for node click?<br/>view.on("click", function(vw, index, node, e){<br/> alert('Node "' + node.id + '" at index: ' + index + " was clicked.");<br/>});<br/><br/>// direct load of JSON data<br/>view.load("foobar.php");<br/><br/>// Example from my blog list<br/>var tpl = new Roo.Template(<br/> '<div class="entry">' +<br/> '<a class="entry-title" href="{link}">{title}</a>' +<br/> "<h4>{date} by {author} | {comments} Comments</h4>{description}" +<br/> "</div><hr />"<br/>);<br/><br/>var moreView = new Roo.JsonView("entry-list", tpl, {<br/> jsonRoot: "posts"<br/>});<br/>moreView.on("beforerender", this.sortEntries, this);<br/>moreView.load({<br/> url: "/blog/get-posts.php",<br/> params: "allposts=true",<br/> text: "Loading Blog Entries..."<br/>});<br/></code></pre>
89 <!-- ============================== Class comment block... ========================== -->
91 <div class="comments">
92 <b>Class Comments / Notes</B> =>
93 <u onclick="parent.CommentDialog.showCommentId = 'Roo.JsonView';">[Add Your comment/notes about this class]</u>
95 <iframe frameborder="0" id="comments-Roo" style="border: none;width:100%;"
96 src="/blog.php/GtkDjsComments/Roo.JsonView.html"></iframe>
101 <!-- ============================== config options ========================== -->
106 <div class="hr"></div>
107 <a id="Roo.JsonView-configs"></a>
111 <table cellspacing="0" class="member-table">
112 <caption class="Empty">Config Options - Has None</caption>
126 <!-- ============================== public properties ==================== -->
130 <a id="Roo.JsonView-props"></a>
136 <table cellspacing="0" class="member-table">
137 <caption class="Empty">Public Properties - Has None</caption>
143 <!-- ============================== methods summary / details ======================== -->
146 <a id="Roo.JsonView-methods"></a>
147 <!-- constructor?? -->
154 <!-- then dynamics first -->
161 <table cellspacing="0" class="member-table">
162 <caption>Public Methods</caption>
164 <th class="sig-header" colspan="2">Method</th>
165 <th class="msource-header">Defined By</th>
175 <tr class="method-row config-row-alt0 expandable notInherited">
176 <td class="micon"><a class="exi" href="#expand"> </a></td>
180 <a id="Roo-method-JsonView" name=".JsonView"></a>
181 <div class="fixedFont">
182 <span class="attributes">new <B>Roo.</B></span><b class="itemname">JsonView</b>
184 (<a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/HTMLElement/Element <B><i>container</i></B>, Template <B><i>tpl</i></B>, <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a> <B><i>config</i></B>)
192 <div class="short">Create a new Roo.JsonView</div>
199 Create a new Roo.JsonView
202 <dl class="detailList">
203 <dt class="heading">Parameters:</dt>
206 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/HTMLElement/Element</span> <b>container</b>
209 <dd>The container element where the view is to be rendered.</dd>
212 <span class="fixedFont">Template</span> <b>tpl</b>
215 <dd>The rendering template</dd>
218 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a></span> <b>config</b>
221 <dd>The config object</dd>
245 <tr class="method-row config-row-alt1 expandable notInherited">
246 <td class="micon"><a class="exi" href="#expand"> </a></td>
250 <a id="Roo.JsonView-method-clearFilter" name=".clearFilter"></a>
251 <div class="fixedFont">
252 <span class="attributes"></span><b class="itemname">clearFilter</b>
261 <div class="short">Clears the current filter.</div>
267 Clears the current filter.
296 <tr class="method-row config-row-alt0 expandable notInherited">
297 <td class="micon"><a class="exi" href="#expand"> </a></td>
301 <a id="Roo.JsonView-method-filter" name=".filter"></a>
302 <div class="fixedFont">
303 <span class="attributes"></span><b class="itemname">filter</b>
305 (<a href="./String.html#constructor" roo:cls="String.html#constructor">String</a> <B><i>property</i></B>, <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/RegExp <B><i>value</i></B>)
312 <div class="short">Filter the data by a specific property.</div>
318 Filter the data by a specific property.
325 <dl class="detailList">
326 <dt class="heading">Parameters:</dt>
329 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a></span> <b>property</b>
332 <dd>A property on your JSON objects</dd>
335 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/RegExp</span> <b>value</b>
338 <dd>Either string that the property values<br/>should start with, or a RegExp to test against the property</dd>
364 <tr class="method-row config-row-alt1 expandable notInherited">
365 <td class="micon"><a class="exi" href="#expand"> </a></td>
369 <a id="Roo.JsonView-method-filterBy" name=".filterBy"></a>
370 <div class="fixedFont">
371 <span class="attributes"></span><b class="itemname">filterBy</b>
373 (<a href="./Function.html#constructor" roo:cls="Function.html#constructor">Function</a> <B><i>fn</i></B>, <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a> <B><i>scope</i></B>)
380 <div class="short">Filter by a function.</div>
386 Filter by a function. The passed function will be called with each<br/>object in the current dataset. If the function returns true the value is kept,<br/>otherwise it is filtered.
393 <dl class="detailList">
394 <dt class="heading">Parameters:</dt>
397 <span class="fixedFont"><a href="./Function.html#constructor" roo:cls="Function.html#constructor">Function</a></span> <b>fn</b>
403 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a></span> <b>scope</b>
406 <dd>(optional) The scope of the function (defaults to this JsonView)</dd>
432 <tr class="method-row config-row-alt0 expandable notInherited">
433 <td class="micon"><a class="exi" href="#expand"> </a></td>
437 <a id="Roo.JsonView-method-getCount" name=".getCount"></a>
438 <div class="fixedFont">
439 <span class="attributes"></span><b class="itemname">getCount</b>
447 <a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a>
456 <div class="short">Get the number of records in the current JSON dataset</div>
462 Get the number of records in the current JSON dataset
473 <dl class="detailList">
474 <dt class="heading">Returns:</dt>
476 <dd><span class="fixedFont"><a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a></span> </dd>
498 <tr class="method-row config-row-alt1 expandable notInherited">
499 <td class="micon"><a class="exi" href="#expand"> </a></td>
503 <a id="Roo.JsonView-method-getNodeData" name=".getNodeData"></a>
504 <div class="fixedFont">
505 <span class="attributes"></span><b class="itemname">getNodeData</b>
507 (<a href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-58190037">HTMLElement</a>/Array <B><i>node</i></B>)
513 <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a>/Array
522 <div class="short">Returns the JSON object for the specified node(s)</div>
528 Returns the JSON object for the specified node(s)
535 <dl class="detailList">
536 <dt class="heading">Parameters:</dt>
539 <span class="fixedFont"><a href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-58190037">HTMLElement</a>/Array</span> <b>node</b>
542 <dd>The node or an array of nodes</dd>
550 <dl class="detailList">
551 <dt class="heading">Returns:</dt>
553 <dd><span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a>/Array</span> If you pass in an array, you get an array back, otherwise<br/>you get the JSON object for the node</dd>
575 <tr class="method-row config-row-alt0 expandable notInherited">
576 <td class="micon"><a class="exi" href="#expand"> </a></td>
580 <a id="Roo.JsonView-method-load" name=".load"></a>
581 <div class="fixedFont">
582 <span class="attributes"></span><b class="itemname">load</b>
584 (<a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a>/String/Function <B><i>url</i></B>, <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/Object <B><i>params</i></B>, <a href="./Function.html#constructor" roo:cls="Function.html#constructor">Function</a> <B><i>callback</i></B>, <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a> <B><i>discardUrl</i></B>)
591 <div class="short">Performs an async HTTP request, and loads the JSON from the response.</div>
597 Performs an async HTTP request, and loads the JSON from the response. If <i>params</i> are specified it uses POST, otherwise it uses GET.
604 <dl class="detailList">
605 <dt class="heading">Parameters:</dt>
608 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a>/String/Function</span> <b>url</b>
611 <dd>The URL for this request, or a function to call to get the URL, or a config object containing any of the following options:<br/> <pre><code><br/> view.load({<br/> url: "your-url.php",<br/> params: {param1: "foo", param2: "bar"}, // or a URL encoded string<br/> callback: yourFunction,<br/> scope: yourObject, //(optional scope)<br/> discardUrl: false,<br/> nocache: false,<br/> text: "Loading...",<br/> timeout: 30,<br/> scripts: false<br/> });<br/> </code></pre><br/>The only required property is <i>url</i>. The optional properties <i>nocache</i>, <i>text</i> and <i>scripts</i><br/>are respectively shorthand for <i>disableCaching</i>, <i>indicatorText</i>, and <i>loadScripts</i> and are used to set their associated property on this UpdateManager instance.</dd>
614 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/Object</span> <b>params</b>
617 <dd>(optional) The parameters to pass, as either a URL encoded string "param1=1&param2=2" or an object {param1: 1, param2: 2}</dd>
620 <span class="fixedFont"><a href="./Function.html#constructor" roo:cls="Function.html#constructor">Function</a></span> <b>callback</b>
623 <dd>(optional) Callback when transaction is complete - called with signature (oElement, bSuccess)</dd>
626 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a></span> <b>discardUrl</b>
629 <dd>(optional) By default when you execute an update the defaultUrl is changed to the last used URL. If true, it will not store the URL.</dd>
655 <tr class="method-row config-row-alt1 expandable notInherited">
656 <td class="micon"><a class="exi" href="#expand"> </a></td>
660 <a id="Roo.JsonView-method-refresh" name=".refresh"></a>
661 <div class="fixedFont">
662 <span class="attributes"></span><b class="itemname">refresh</b>
671 <div class="short">Refreshes the view.</div>
706 <tr class="method-row config-row-alt0 expandable notInherited">
707 <td class="micon"><a class="exi" href="#expand"> </a></td>
711 <a id="Roo.JsonView-method-sort" name=".sort"></a>
712 <div class="fixedFont">
713 <span class="attributes"></span><b class="itemname">sort</b>
715 (<a href="./String.html#constructor" roo:cls="String.html#constructor">String</a> <B><i>property</i></B>, <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a> <B><i>direction</i></B>, <a href="./Function.html#constructor" roo:cls="Function.html#constructor">Function</a> <B><i>sortType</i></B>)
722 <div class="short">Sorts the data for this view and refreshes it.</div>
728 Sorts the data for this view and refreshes it.
735 <dl class="detailList">
736 <dt class="heading">Parameters:</dt>
739 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a></span> <b>property</b>
742 <dd>A property on your JSON objects to sort on</dd>
745 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a></span> <b>direction</b>
748 <dd>(optional) "desc" or "asc" (defaults to "asc")</dd>
751 <span class="fixedFont"><a href="./Function.html#constructor" roo:cls="Function.html#constructor">Function</a></span> <b>sortType</b>
754 <dd>(optional) A function to call to convert the data to a sortable value.</dd>
783 <!-- ============================== events summary / details ======================== -->
786 <a id="Roo.JsonView-events"></a>
795 <table cellspacing="0" class="member-table">
796 <caption>Events</caption>
799 <th class="sig-header" colspan="2">Event</th>
800 <th class="msource-header">Defined By</th>
809 <tr class="method-row expandable config-row-alt0 notInherited">
810 <td class="micon"><a class="exi" href="#expand"> </a></td>
813 <a id="Roo.JsonView-event-*beforerender"></a>
815 <div class="fixedFont">
816 <b class="itemname">beforerender</b> (<a href="./Roo.JsonView.html#constructor" roo:cls="Roo.JsonView.html#constructor">Roo.JsonView</a> <B><i>this</i></B>, <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a> <B><i>data</i></B>)
822 <div class="short">Fires before rendering of the downloaded JSON data.
828 Fires before rendering of the downloaded JSON data.
834 <dl class="detailList">
835 <dt class="heading">Parameters:</dt>
838 <span class="fixedFont"><a href="./Roo.JsonView.html#constructor" roo:cls="Roo.JsonView.html#constructor">Roo.JsonView</a></span> <b>this</b>
844 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a></span> <b>data</b>
847 <dd>The JSON data loaded</dd>
870 <tr class="method-row expandable config-row-alt1 notInherited">
871 <td class="micon"><a class="exi" href="#expand"> </a></td>
874 <a id="Roo.JsonView-event-*load"></a>
876 <div class="fixedFont">
877 <b class="itemname">load</b> (<a href="./Roo.JsonView.html#constructor" roo:cls="Roo.JsonView.html#constructor">Roo.JsonView</a> <B><i>this</i></B>, <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a> <B><i>data</i></B>, <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a> <B><i>response</i></B>)
883 <div class="short">Fires when data is loaded.
889 Fires when data is loaded.
895 <dl class="detailList">
896 <dt class="heading">Parameters:</dt>
899 <span class="fixedFont"><a href="./Roo.JsonView.html#constructor" roo:cls="Roo.JsonView.html#constructor">Roo.JsonView</a></span> <b>this</b>
905 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a></span> <b>data</b>
908 <dd>The JSON data loaded</dd>
911 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a></span> <b>response</b>
914 <dd>The raw Connect response object</dd>
937 <tr class="method-row expandable config-row-alt0 notInherited">
938 <td class="micon"><a class="exi" href="#expand"> </a></td>
941 <a id="Roo.JsonView-event-*loadexception"></a>
943 <div class="fixedFont">
944 <b class="itemname">loadexception</b> (<a href="./Roo.JsonView.html#constructor" roo:cls="Roo.JsonView.html#constructor">Roo.JsonView</a> <B><i>this</i></B>, <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a> <B><i>response</i></B>)
950 <div class="short">Fires when loading fails.
956 Fires when loading fails.
962 <dl class="detailList">
963 <dt class="heading">Parameters:</dt>
966 <span class="fixedFont"><a href="./Roo.JsonView.html#constructor" roo:cls="Roo.JsonView.html#constructor">Roo.JsonView</a></span> <b>this</b>
972 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a></span> <b>response</b>
975 <dd>The raw Connect response object</dd>
1005 <!-- ============================== footer ================================= -->
1006 <div class="fineprint" style="clear:both">
1008 Documentation generated by <a href="http://www.akbkhome.com" target="_blankt">Introspection Doc Generator</a> on Fri Jul 16 2010 16:11:48 GMT+0800 (HKT)
1010 <a href="http://www.jsdoctoolkit.org/" target="_blank">JsDoc Toolkit</a>