This
example demonstrates the basic Flexicious Flex DataGrid Ultimate.
On the
surface, it looks and acts very much like a regular Flex DataGrid, but as you
go through some of the examples on the left, you will start to see its prowess.
Now in this example - notice a few subtleties. When you scroll, you will notice
that the it is not scrolling each row. That is, we
have implemented smooth scrolling, so you should be able to see a partial row
as you scroll. This does not mean much to fixed row
height rows, but matters a great deal in hierarchical grids as you will see.
About this
example: For those of you familiar with the Flexicious Extensions, most of this
should look pretty straight forward, and similar to the Flexicious Extensions. A
few exceptions:
The pdfBytesReady
event. From the
documentation:
"Dispatched when the user
clicks the 'Generate PDF' button on the Print Preview. In response to this user action,
the grid simply prints it output to a byte array of page images. This byte
array can then be sent to any PDF generation library either on the client or
the server, for example Alive PDF. We provide integration code for AlivePDF out of the box."
Another
item of interest is the declaration of the "columnLevel". Although it
is perfectly capable of displaying flat data, Flexicious Ultimate was designed primarily
to display Hierarchical Data. The levels in the hierarchy are defined by the columnLevel property.
Each Flexicious Ultimate grid, has a root column level. For flat grids, this is the
only column Level. For nested grids, the root column level can have a nextLevel
defined, which in turn also can have a nextLevel
defined and so on. The inner most level can also have a nextLevelRenderer defined, which
we will demonstrate in a subsequent example. In this example however, we are simply
creating a Grid with a root columnLevel. Please note, it is not necessary to always declare the column level for
flat grids. If you do not declare one, it is implicitly created for you. So you
can do something like:
<ndg:FlexDataGrid>
...
< ndg:columns>
...
</ ndg:columns>
</ ndg:FlexDataGrid>
There are
many properties in this example like enableCopy, enablePreferencePersistence, enableExport,
enablePrint that we could elaborate on, but for the
most part they are covered in their respective topics in the Flexicious Extension
documentation, as well as the asdocs for Flexicious
Ultimate. Do make sure you look at all the enable* properties, there are some
handy ones in there.