Flexible, Powerful DataGrad from Sencha

Many of the web functionalities that we rely on once lived within individual desktop applications. From office suites, games, and financial tools, all of them are now web applications; they’re just as feature packed as their desktop counterparts. In the past I’ve used a variety of JavaScript grid widgets on client sites, and each had a number of pain points: performance, size, flexibility, etc. Sencha’s powerful DataGrid is possibly the best grid I’ve seen yet — let’s have a look.

Quick Hits

• Create responsive tables with filtering, sorting, pagination, AJAX, and much more
• Handles millions of records with no performance degradation
• Data import and export capabilities for CSV, TSV, HTML, PDF, and XLS
• Advanced plugin capabilities: Row operations edit, Drag-and-drop, Copy-Paste, Expand, Select, and more
• Support for embedding other Sencha JavaScript widgets within the grid
• Grids can be created from markup to allow maximum accessibility
• Numerous working examples to start your grid from

It’s easy to create an Ext JS grid from an existing HTML table from a few lines of JavaScript code:

grid = Ext.create('Ext.ux.grid.TransformGrid', 'my-table', {
    stripeRows: true,
    height: 130
});

grid.render(Ext.getBody());

Focus on Performance

Performance has always been a huge factor when determining a grid’s usability. Performance factors include initial load and render, drag/drop, data binding speed, sup-component speed, and general use. If you fail any of these tests, you’re likely going to shed users quickly. Sencha’s Grid is incredibly performant — all of these operations feel snappy and thus the grid feels really great to use.

Incredible Functionality

When users and engineers see powerful grids they tend to want more — sorting, data binding, drag and drop, special formatting, customizable fields, embedding of other widgetry — and Sencha Grid allows for all of that. And since Sencha already has a number of those components already, you save time not having to build them out. Integrate!

Ease of Implementation

As I’ve stated above, implementing a Sencha Grid can be easy, accessible, and with little code at that. Dynamically instantiating a Grid from an existing HTML table is easy, while initiating from JavaScript is also intuitive, for which there are many examples available!

Sencha has a reputation for creating amazing JavaScript utilities for more than a decade now. That reputation clearly shines as their Grid is amazing from any number of aspects!