How to Use X-DBGrid Component 6.7 with Any Indexed Data Structures

Please note that enabling bordering via this config will not add a border-coloror border-style CSS property to the component; you provide the border-colorand border-style via CSS rule or style configuration(if not already provide by the theme).

X-DBGrid Component 6.7

Download File

If true, this component will be the default scope (this pointer) for eventsspecified with string names so that the scope can be dynamically resolved. Thecomponent will automatically become the defaultListenerScope if acontroller is specified.

The default flex-shrink value for box layout items is set to 0 in thestylesheet, which is different from the browser's default flex-shrink valueof 1. This accommodates the majority use case for applications since wherenon-flexed components are typically not expected to shrink smaller than theirdefault size.

A Component may be floated above all other components in the application. This means thatthe component is absolutely positioned, and will move to the front and occlude othersibling floated component if clicked.

By default, descendant floated components are all positioned using the viewportcoordinate system. To make a floating component a positioning parent for descendants,and have the ancestors positioned relatively, configure the parent floated componentwith cfg-relative: true.

If the scope is not given, or implied using a prefix of "this", then either theViewController or the closest ancestor component configuredas defaultListenerScope is assumed to be the object with the method.

Note that this id will also be used as the element id for the containing HTML elementthat is rendered to the page for this component. This allows you to write id-based CSSrules to style the specific instance of this component uniquely, and also to selectsub-elements using this component's id as the parent.

An itemId can be used as an alternative way to get a reference to a component when noobject reference is available. Instead of using an id with Ext#getCmp,use itemId with Ext.Container#getComponent which will retrieve itemId's orid's. Since itemId's are an index to the container's internal MixedCollection,the itemId is scoped locally to the container - avoiding potential conflicts withExt.ComponentManager which requires a unique id.

One or more names of config properties that this component should publishto its ViewModel. Generally speaking, only properties defined in a class configblock (including ancestor config blocks and mixins) are eligible for publishingto the viewModel. Some components override this and publish their most usefulconfigs by default.

Specifies a name for this component inside its component hierarchy. This namemust be unique within its viewor its Ext.app.ViewController. See the documentation inExt.container.Container for more information about references.

All touch actions are enabled (true) by default, so it is usually only necessaryto specify which touch actions to disable. For example, the following disablesonly horizontal scrolling and pinch-to-zoom on the component's main element:

The primary motivation for setting the touch-action of an element is to preventthe browser's default handling of a gesture such as pinch-to-zoom, ordrag-to-scroll, so that the application can implement its own handling of thatgesture on the element. Suppose, for example, a component has a custom draghandler on its element and wishes to prevent horizontal scrolling of its containerwhile it is being dragged:

Note: It is not enough to set this property to true to makea component keyboard interactive. You also need to make sure thatthe component's focusEl is reachable via Tab key (tabbable).See also tabIndex.

This method is called after the component is initially added to the DOM. If thiscomponent Ext.Container other components, the afterRender methodfor child components is called before the parent's afterRender.

This method is not generally needed because components always have their own DOMelement and these are maintained by config propertyupdaters prior to insertion in the DOM. In general, it is always best to manipulatethe component's elements outside the DOM where there is no associated reflow orlayout cost. This method is useful for situations where the component's elementsmust be in the DOM in order to be manipulated correctly.

Bubbles up the getRefOwner hierarchy, calling the specified functionwith each component. The scope (this reference) of the function call will be thescope provided or the current component. The arguments to the function willbe the args provided or the current component. If the function returns false at anypoint, the bubble is stopped.

The method finds this floated component's floatParent. That means a DOM positioningcontainer which acts as a root element for sibling floated components, and allows allowsfloated components to be absolutely positioned, and their encapsulating elements to bereordered to produce a visual stacking effect.

There is a global floatParent element, created on demand when the first top levelfloated component is shown. This may be an item child of a container configured withcfg-floated: true, or a free floated component which is programaticallyshown.

Child items of components inside a floated component may also be configured floated.These are give a floatParent which is created on demand wrapping the nearest floatedancestor. This means that when that ancestor's element is brought to the top of thestack (by moving its element to the end of its own floatParent), the descendant elementswill automatically remain above.

Finds the owning cfg-floated component (if any) responsible forthe base z-index stack position of this compoonent, and, if that componentis cfg-relative, for the coordinate system in which this componentis positioned.

In some cases, a config may be explicitly set on a component with the intent ofonly being presented to its children while that component should act upon theinherited value (see referenceHolder for example). In these cases the skipThisparameter should be specified as true.

This method should be called when the instance is ready to start listening forkeyboard events. This is called automatically for Ext.Component and derivedclasses. This is done after the component is rendered.

false to return this as the name holder ifthis instance has set nameHolder. Unlike getInheritedConfig this methoddefaults to true because it is possible that a name property set by theowner of a component that is also a nameHolder itself. In this case, thename connects not to this component but to the parent nameHolder.

false to return this as the reference holder ifthis instance has set referenceHolder. Unlike getInheritedConfig this methoddefaults to true because it is possible that a reference property set by theowner of a component that is also a referenceHolder itself. In this case, thereference connects not to this component but to the parent referenceHolder.

This method is called the first time a component is inserted into the DOM. If thiscomponent Ext.Container other components, the onRender methodfor child components is called after the parent's onRender.

This method is not generally needed because components always have their own DOMelement and these are maintained by config propertyupdaters prior to insertion in the DOM. In general, it is always best to interrogatethe component's elements outside the DOM where there is no associated reflow orlayout cost. This method is useful for situations where the component's elementsmust be in the DOM. For example to be measured correctly.

For example if a menu's submenu contains an Ext.form.field.Date, that top levelmenu owns the elements of the date picker. Using this method, you can tell if an eventtook place within a certain component tree.

Returns the default listener scope for a "satellite" of this component.Used for resolving scope for observable objects that are not part of the normalContainer/Component hierarchy (for example, plugins)

Brings a cfg-floated Component to the front of any other visible, floatedComponents while honoring all alwaysOnTop settings. This may not becometopmost if another visible floated component has a higher alwaysOnTop value.

Toolable components need special handling for their padding. When there are no tools(which usually means no dock wrapper) the padding on all sides is placed on the body-el,However, when the component has tools, the horizontal padding needs to be removedfrom the body-el and placed on the innermost dock wrapper so that the horizontal paddingis between the outermost tools and the left/right edges of the component. In thisconfiguration the space between the body and the tools is provided by the toolsthemselves via $tool-spacing.

The vertical padding remains on the body-el so that the height of the toolable componentwhen auto-heighted is determined by the body-el's line-height + padding + the elementborders. The tools gain an additional advantage from this arrangement because it meansthey can be taller than the component's line-height and not cause the component's heightto increase since they are not "inside" of the vertical padding.

In versions prior to 6.2.0, components embedded in this way had no access to the grid'sExt.app.ViewModel. The field referenced by the column's dataIndex was bound tothe component's defaultBindProperty.

uniGUI is a web application framework for RAD Studio Delphi. It uses Sencha Ext JS components to create sophisticated modern web applications. uniGUI enables developers to create, design and debug web applications, using a unique set of visual components specifically created for Delphi. uniGUI provides a very comfortable development environment with a smooth learning curve, WYSIWYG visual designer and super easy deployment. uniGUI today is used by a great number of Delphi developers globally.

The first public build of uniGUI used Ext JS 3.1.0. It was in July 2010 when the first beta version of uniGUI was made public. In those early days, uniGUI capabilities were very limited compared to what it offers today. The support library ExtPascal was a wrapper for Ext JS components which could automatically translate Ext JS to Pascal wrappers. The last Ext JS version officially used by ExtPascal was Ext JS 3.2.1. It was never updated to Ext JS 4.x and later, so it was our job to do the conversion. 2ff7e9595c