Skip to Navigation | Skip to Content



Nitobi Grid

Download and integrate our enterprise-class grid–part of our Complete UI suite–into your app. Save yourself time, save your boss’s money and look like a genius.

Our grid offers features that matter to developers: Excel copy and paste, in-place cell editing, and live scrolling

Live Demos

Basic Grid

A basic Grid using static, client-side data

Copy and Paste

Demonstrates the copy and paste functionality of the Grid – between Grids or between a Grid and an Excel worksheet.

Editors Grid

A demo showing the different data types the Grid has native editors for.

Livescrolling Mode

Demo of the Grid’s livescroling mode, where records are continually read from the database as the user scrolls the component.

Master-Detail Grids

Display hierarchical data in two separate Grids that are updated through Ajax calls.

Multi-Select

Select multiple records at once on the Grid.

Paging Mode

Demo of the Grid’s paging mode, where a small set of records are displayed, and can be paged by the user.

Remote Data

Demo of the Grid’s ability to read remote data from a server to be populated.

Resizable Grid

Demo of the Grid’s resize functionality, which can be used programmatically or by the user dragging and dropping.

Showall Mode

Showing the Grid’s showall mode, where all of the records are displayed in a single set for the user, populated from a single Ajax call.

Static Data

Demo showing the different static data types and editors that the Grid supports.

Overview

Rich User Experience.

Users can resize columns, copy and paste data with the mouse, navigate with the keyboard, perform in-place editing, and scroll through huge datasets as though they were working with a desktop application.

Minimal Coding Required.

A declarative interface makes customizing the behaviour of your grid quick and easy. Extend the built in features using the JavaScript API.

Unrivaled Performance.

An XML-based Ajax data architecture allows for high-performance rendering of large amounts of data. Allows users to sort, scroll, edit, and save huge datasets with the speed of desktop software.

Cross Platform.

Native support for Java, Classic ASP, and PHP. ASP.NET, Coldfusion.

Integrates with Adobe Dreamweaver.

Simply drag and drop Ajax components into sites and applications using Adobe Dreamweaver CS3.

Cross Browser.

Nitobi components have full support for an array of modern browsers including IE6+, Firefox, Mozilla 1.3+, Camino, and Netscape 7+, and Safari 3+.

Extendable.

Integrate the component into your application architecture with our robust JavaScript API. Define custom behaviours, tap into internal events and even combine with open source Ajax frameworks like Dojo and Prototype.

Features

Ajax Architecture

Using an ultra-concise data transport method, Grid is able to retrieve and save data on-demand with minimal delays, making things like live-scrolling, paging, sorting, and master-detail seamless and fast.

No postbacks are ever required. Grids can be instantiated on-the-fly and data binding can take place whenever it’s needed using asynchronous Ajax requests.

Cross-Platform Support

Available with native support for Java, PHP and Classic ASP, Coldfusion, and ASP.NET.

Cross-Browser Support

Native support for an array of modern browsers including Internet Explorer 6.0+, Netscape 7.1+, Mozilla 1.3+, Firefox, Camino, and Safari 3+.

Integrates with Adobe Dreamweaver

Simply drag and drop Ajax components into sites and applications using Dreamweaver CS3.

Three Unique Grid Modes

Three modes providing unique functionality aligning to particular use cases. Automatically predefining a number of subordinate attributes, mode can also be configured by defining its attributes individually.

All modes can be configured in an unbound or bound state (using client-side data or a server-side database).

  • LiveScrolling- Scroll through large datasets (thousands or millions of records) in real-time without noticeable performance impacts. Livescrolling is supported in both Static and Databound modes. In Static (or unbound) mode you can provide the Grid a massive XML document, and it will apply the livescrolling technique to improve the runtime performance for the user.
  • Paging – For situations where proper pagination is needed, paging mode will explicitly call up pages of predefined sizes like you would find in a standard datagrid. Ajax is still used to do the server communication. This can be applied to both bound and unbound data modes.
  • ShowAll – Will retrieve and display the entire recordset without any pagination or livescrolling applied. This is useful for shorter datasets or when other components need access to the entire dataset at once.

Excel Copy and Paste

Use the mouse or keyboard to select a block of cells, and copy and paste between Grid and Excel, or between different grids on different pages. Useful for when users are working offline or need to move between desktop software like Microsoft Office and the web.

Frozen Columns

Keep important columns visible by locking them in place while scrolling horizontally through the remainder of the visible columns. Useful for very wide tables with many columns of data.

Resizable Columns

Use the mouse to click and drag to resize columns just as you would in a regular datagrid or Excel.

In-place Cell Editing

Click and edit cells directly just as you would in Excel.

Multiple Editor Typess

Use built-in editor types like: textbox (types NUMERIC or STRING), checkbox, selectbox (standard html SELECT), image (static and non-editable) or an autocomplete (LOOKUP) such as Nitobi's ComboBox.

Static or Databound Modes

Bind the grid to in-page data like an XML document, or feed it data with JavaScript using the API. Bind to databases using the lightning-fast Ajax interface.

Remote Sorting

Sort against massive tables by roundtripping to the server using Ajax calls.

Dockable & Customizable Toolbar

Pull out the toolbar using the mouse as you would on the desktop. Configure the buttons and their attributes using the built-in API.

Linkable Grids

Put multiple grids on a page and easily link them together using the built-in events and JavaScript API. Useful for showing one-to-many relationships (master-detail).

XML-Based Data Architecture

Using a standard MVC model, the Grid contains a concise XML document which it runs against. Feed it new XML from the server or on the client using the JavaScript API, or use our server-side library to avoid working with XML altogether.

Cell Value Masking

Take number and date values and mask them according to your preferences. Display 93323 as 93,323.00, or 09/11/2006 as November 9, 2006 without altering the underlying data.

Excel-like Keyboard Navigation

Move between cells and pages of data using only the keyboard if preferred. Navigate with the arrow keys or PageUp/PageDown as you would in Excel or other desktop-based datagrids

.

Technical Details

Server-Platform Requirements

To use the native server-side XML libraries, you must be using one of the following platforms.

  • Java JDK 1.4+
  • Java Server Faces (JSF)
  • Active Server Pages 3.0 (ASP)
  • PHP 4+
  • ASP.NET 1.1, 2.0+
  • Coldfusion MX

End-User Platform Compatibility

  • Internet Explorer 6.0+
  • Firefox 1.0+
  • Safari 3.0+
  • Mozilla 1.3+
  • Camino 1.3+

Search Posts

You are currently browsing the archives for the Uncategorized category.

Archives

Categories

LinkedIn Profile

  • My Profile


My ideal work culture:
[See my summary] [What's yours?]