Flexible, Powerful DataGrad from Sencha (Sponsored)


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 moreHandles millions of records with no performance degradationData import and export capabilities for CSV, TSV, HTML, PDF, and XLSAdvanced plugin capabilities: Row operations edit, Drag-and-drop, Copy-Paste, Expand, Select, and moreSupport for embedding other Sencha JavaScript widgets within the gridGrids can be created from markup to allow maximum accessibilityNumerous 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


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!

The post Flexible, Powerful DataGrad from Sencha (Sponsored) appeared first on David Walsh Blog.