digitalBush

Download Latest (0.1)

• Uncompressed

Overview

This is an attempt by me to make a combined effort toward creating a jQuery based grid widget. The jQuery community has a lot of different plugins which manipulate tables, and I would like to see a common effort towards making those plugins operate cooperatively. This is an alpha level release which contains the following unified table manipulations that I'm using in current projects of mine.

• Basic Row manipulation: addition, insertion, and deletion.
• Row navigation, selection, and activations by mouse and keyboard.
• Striping which is triggered by a "CollectionChanged" event generated by the basic row manipulations above
• Column resizing.
• Scrolling tables (Please note this will not work in IE in quirks mode).

Goals and Thoughts

• I would like to see a standard set of events emerge from this project for grid manipulation (ie CollectionChanged, RowSelected, etc). This will make outside interaction with the grid much easier and predictable.
• I have provided what I think is a good way for other code to be attached to the grid that encourages compatibility among the grid add ons, so I would like to see this lead to some sort of standard for those table manipulators amongst us.
• I would like to develop the following additional add ons: sorting, filtering, paging, ajax
• I have additional planned additions to current add-ons which are commented in my source code

Usage

First, include the jquery core javascript file. Currently all of the plugins I've developed are in this file, but I would like to create some sort of pick and choose type system.

<script src="jquery.grid.core.js" type="text/javascript"></script>

Next, call the grid function for those table(s) you would like to attach to.

t.grid({			
	 navigate:{
	 	 maintainSelection:false		
	},
	scroll:{
		width:"600",
		height:"300",
		colWidths:[200,200,200]
	},
	stripe:true,
	columnResize:true
});

I have made my plugins do an initial check of the settings to see if the user wants to use that particular function with the current grid they are binding to. The 'row' plugin does not follow this rule so far because I almost think that it should just be core built-in functionality. For instances where you wish to use the defaults, simply state the plugin name with "true" as you see above for the 'stripe' and 'columnResize' add-ons. The main method passes the settings to the corresponding addon by name

Demo

The following example is a demonstration from the examples above.

Header1	Header2	Header3
Foot1	Foot2	Foot3

1 Comment so far

1. digitalBush » Blog Archive » jQuery Grid Plugin @ August 12th, 2007

   [...] love to hear your feedback on this. So, please go to the page I’ve set up on this site here and see the demo and look at the code. Once you’ve done all of that, please comment this blog [...]