After weeks of searching for the perfect grid based data editor for my project, I’ve aspired to build one myself. Sure there are hundreds of existing plugins and more which are well established, and developed by well knowledgeable folks, I find a few shortcomings. Drawing inspiration from the existing plugins, here are my goals:
Goals:
- Uses jQuery library
- Small and light. Size should be less than 30 KB for minified version
- Dynamic data source for easy table population (JSON or plain HTML)
- Create, Read, Update and Delete (CRUD) operation
- Sorting based on columns (using tablesorter plugin)
- Searching based on filters for multiple columns
- Follows KISS Principal – Keep it simple stupid. No unnecessary insertion of DOM elements
- Insertion of checkbox for each row and defining custom button to perform an action
What seems like a huge list of features add to my very basic problem : I’m still a noob at jQuery and javascript. So, as a personal goal this project is a way for me to learn jQuery right from scratch, and to put it to good use.
Methodology:
- Study the existing plugins to understand how they work
- Use code snippets that are already available. Reduces work, and will be much better than reinventing the wheel the wrong way
- Less attention to appearance (CSS) till the code really works, partly because I’m still learning CSS, and would be tough to combine both jQuery and css code when I’m new to both.
As you’d have guessed, its an ambitious project for someone who is new to javascript/jQuery. Nevertheless, I hope I can pull it off with guidance from knowledgeable people who know their jQuery. I plan to host it on either github or google code and put up a dedicated page on this blog to keep track of the development. As the first step, I’ll start with defining the various functions that are required, thus creating a skeleton jQuery plugin, which simply displays a one line output when called in order (yea, I’m pathetic).
So anyone who reads this, please leave your thoughts, advice, comments here. Thank You.