Ext界面生成器，功能强大

<div class="body-wrap"> <div class="top-tools"> <a class="inner-link" href="#Ext.grid.PropertyGrid-props"><img src="../resources/images/default/s.gif" class="item-icon icon-prop">Properties</a> <a class="inner-link" href="#Ext.grid.PropertyGrid-methods"><img src="../resources/images/default/s.gif" class="item-icon icon-method">Methods</a> <a class="inner-link" href="#Ext.grid.PropertyGrid-events"><img src="../resources/images/default/s.gif" class="item-icon icon-event">Events</a> <a class="inner-link" href="#Ext.grid.PropertyGrid-configs"><img src="../resources/images/default/s.gif" class="item-icon icon-config">Config Options</a> <a class="bookmark" href="../docs/?class=Ext.grid.PropertyGrid"><img src="../resources/images/default/s.gif" class="item-icon icon-fav">Direct Link</a> </div> <div class="inheritance res-block"> <pre class="res-block-inner"><a ext:cls="Ext.util.Observable" ext:member="" href="output/Ext.util.Observable.html">Observable</a> <img src="resources/elbow-end.gif"/><a ext:cls="Ext.Component" ext:member="" href="output/Ext.Component.html">Component</a> <img src="resources/elbow-end.gif"/><a ext:cls="Ext.BoxComponent" ext:member="" href="output/Ext.BoxComponent.html">BoxComponent</a> <img src="resources/elbow-end.gif"/><a ext:cls="Ext.Container" ext:member="" href="output/Ext.Container.html">Container</a> <img src="resources/elbow-end.gif"/><a ext:cls="Ext.Panel" ext:member="" href="output/Ext.Panel.html">Panel</a> <img src="resources/elbow-end.gif"/><a ext:cls="Ext.grid.GridPanel" ext:member="" href="output/Ext.grid.GridPanel.html">GridPanel</a> <img src="resources/elbow-end.gif"/><a ext:cls="Ext.grid.EditorGridPanel" ext:member="" href="output/Ext.grid.EditorGridPanel.html">EditorGridPanel</a> <img src="resources/elbow-end.gif"/>PropertyGrid</pre></div> <h1>Class Ext.grid.PropertyGrid</h1> <table cellspacing="0"> <tr><td class="label">Package:</td><td class="hd-info">Ext.grid</td></tr> <tr><td class="label">Defined In:</td><td class="hd-info"><a href="../src/PropertyGrid.js" target="_blank">PropertyGrid.js</a></td></tr> <tr><td class="label">Class:</td><td class="hd-info">PropertyGrid</td></tr> <tr><td class="label">Extends:</td><td class="hd-info"><a ext:cls="Ext.grid.EditorGridPanel" ext:member="" href="output/Ext.grid.EditorGridPanel.html">EditorGridPanel</a></td></tr> </table> <div class="description"> A specialized grid implementation intended to mimic the traditional property grid as typically seen in development IDEs. Each row in the grid represents a property of some object, and the data is stored as a set of name/value pairs in <a ext:cls="Ext.grid.PropertyRecord" href="output/Ext.grid.PropertyRecord.html">Ext.grid.PropertyRecord</a>s. Example usage: <pre><code> var grid = new Ext.grid.PropertyGrid({ title: 'Properties Grid', autoHeight: true, width: 300, renderTo: 'grid-ct', source: { "(name)": "My Object", "Created": new Date(Date.parse('10/15/2006')), "Available": false, "Version": .01, "Description": "A test object" } });</pre></code> </div> <div class="hr"></div> <a id="Ext.grid.PropertyGrid-configs"></a> <h2>Config Options</h2> <table cellspacing="0" class="member-table"> <tr> <th class="sig-header" colspan="2">Config Options</th> <th class="msource-header">Defined By</th> </tr> <tr class="config-row inherited expandable"> <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td> <td class="sig"> <a id="Ext.grid.PropertyGrid-<p>enableDragDrop"></a> <b><p>enableDragDrop</b> : Boolean <div class="mdesc"> <div class="short">True to enable dragging of the selected rows of the GridPanel. Setting this to true causes this GridPanel's GridView ...</div> <div class="long"> True to enable dragging of the selected rows of the GridPanel.</p> <p>Setting this to <b><tt>true</tt></b> causes this GridPanel's <a ext:cls="Ext.grid.GridPanel" ext:member="getView" href="output/Ext.grid.GridPanel.html#getView">GridView</a> to create an instance of <a ext:cls="Ext.grid.GridDragZone" href="output/Ext.grid.GridDragZone.html">Ext.grid.GridDragZone</a>. This is available <b>(only after the Grid has been rendered)</b> as the GridView's <a ext:cls="Ext.grid.GridView" ext:member="dragZone" href="output/Ext.grid.GridView.html#dragZone">dragZone</a> property.</p> <p>A cooperating <a ext:cls="Ext.dd.DropZone" href="output/Ext.dd.DropZone.html">DropZone</a> must be created who's implementations of <a ext:cls="Ext.dd.DropZone" ext:member="onNodeEnter" href="output/Ext.dd.DropZone.html#onNodeEnter">onNodeEnter</a>, <a ext:cls="Ext.dd.DropZone" ext:member="onNodeOver" href="output/Ext.dd.DropZone.html#onNodeOver">onNodeOver</a>, <a ext:cls="Ext.dd.DropZone" ext:member="onNodeOut" href="output/Ext.dd.DropZone.html#onNodeOut">onNodeOut</a> and <a ext:cls="Ext.dd.DropZone" ext:member="onNodeDrop" href="output/Ext.dd.DropZone.html#onNodeDrop">onNodeDrop</a></p> are able to process the <a ext:cls="Ext.grid.GridDragZone" ext:member="getDragData" href="output/Ext.grid.GridDragZone.html#getDragData">data</a> which is provided. </div> </div> </td> <td class="msource"><a ext:cls="Ext.grid.GridPanel" ext:member="#<p>enableDragDrop" href="output/Ext.grid.GridPanel.html#<p>enableDragDrop">GridPanel</a></td> </tr> <tr class="config-row inherited alt expandable"> <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td> <td class="sig"> <a id="Ext.grid.PropertyGrid-activeItem"></a> <b>activeItem</b> : String/Number <div class="mdesc"> <div class="short">A string component id or the numeric index of the component that should be initially activated within the container's...</div> <div class="long"> A string component id or the numeric index of the component that should be initially activated within the container's layout on render. For example, activeItem: 'item-1' or activeItem: 0 (index 0 = the first item in the container's collection). activeItem only applies to layout styles that can display items one at a time (like <a ext:cls="Ext.layout.Accordion" href="output/Ext.layout.Accordion.html">Ext.layout.Accordion</a>, <a ext:cls="Ext.layout.CardLayout" href="output/Ext.layout.CardLayout.html">Ext.layout.CardLayout</a> and <a ext:cls="Ext.layout.FitLayout" href="output/Ext.layout.FitLayout.html">Ext.layout.FitLayout</a>). Related to <a ext:cls="Ext.layout.ContainerLayout" ext:member="activeItem" href="output/Ext.layout.ContainerLayout.html#activeItem">Ext.layout.ContainerLayout.activeItem</a>. </div> </div> </td> <td class="msource"><a ext:cls="Ext.Container" ext:member="#activeItem" href="output/Ext.Container.html#activeItem">Container</a></td> </tr> <tr class="config-row inherited"> <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td> <td class="sig"> <a id="Ext.grid.PropertyGrid-allowDomMove"></a> <b>allowDomMove</b> : Boolean <div class="mdesc"> Whether the component can move the Dom node when rendering (defaults to true). </div> </td> <td class="msource"><a ext:cls="Ext.Component" ext:member="#allowDomMove" href="output/Ext.Component.html#allowDomMove">Component<