如何使用js创建可编辑的网格

Question

I am looking to create a grid structure using javascript or one of its libraries. My idea is as follows: I am a merchandise manager for a retailer and want to create an application to tie into the django project I have been working on to track item sales based on display location. The javascript piece would involve drawing a grid on the screen and allowing the user to draw 'areas' over the grid. Each area would contain a set number of gridboxes, each representing a pallet of goods. At the time the grid is drawn, each box is a DOM object that can be assigned to event handlers etc. When an area is drawn over aa series of these boxes, they become active and each box can be assigned different characteristics. In the end, each box would effectively represent an empty pallet that could then be assigned an item. It's position could then be correlated with sales data via my django app. I just need a way to broadcast/manage the location data using javascript.

Is there a jquery plugin or some other js library that would facilitate such a project? I have checked into Raphael and it will work, but will take more time to create. I am wondering if there is already some kind of grid based drawing tool that would facilitate the process.

Answer 1

Everytime I think of a javascript Grid, I always thing about the fantastic TableSorter

And if you append an editable version to it, I would would say you will have the best AWESOME project!

:o)

Answer 2

extJS javascript框架具有可编辑的网格，有关示例演示和源代码，请参阅http://dev.sencha.com/deploy/dev/examples/grid/edit-grid.html 。

Answer 3

JQuery UI's Selectable would probably be a good place to start. It makes it easy to create a grid whose areas are selectable by dragging a box over it.