What is jQuery.sheet?
jQuery.sheet gives you all sorts of possibilities when it comes to giving your web application a spreadsheet style interface with MS Excel style calculations.
jQuery.sheet addresses the web-based spreadsheet or "websheet" in a different, simple, approach - using html, you simply load the sheet from a url, and you save it to a url... Simple. Or write your own approch. jQuery.sheet manages the sheet creation, viewing, and editing processes, you simply build your application around it.
jQuery.sheet addresses the web-based spreadsheet or "websheet" in a different, simple, approach - using html, you simply load the sheet from a url, and you save it to a url... Simple. Or write your own approch. jQuery.sheet manages the sheet creation, viewing, and editing processes, you simply build your application around it.
jQuery.sheet is also theme-able, using jQuery UI ThemeRoller, so you make the spreadsheet look like you want.For a complete list of all the MS Excel style functions that jQuery.sheet supports, take a look at the Demo, which is the documentation.
Why did I start jQuery.sheet? I like a challenge, I like to learn, I like to contribute, and I saw where other attempts at the same thing, although being nice, could be improved. And with the web basically migrating in it's entirety over to jQuery, I wanted to put some fun back into my javascripting.
Download & Demo
New Release 0.53 Now Available! - Now supports Charts!
| jquery.sheet-0.53.zip |
Examples
(for more, check out the demo, which actually is the documentation)
Basic initialization:
$(document).ready(function() {
$(jQuerySelector).sheet();
});
Make a new sheet (10 Columns by 30 Rows):
$(document).ready(function() {
$(jQuerySelector).sheet({
buildSheet: '10x30'
});
});
Turn your table housed by a div into a sheet:
$(document).ready(function() {
$(jQuerySelector).sheet({
buildSheet: true
});
});
Open a sheet for edit & set it's save location:
$(document).ready(function() {
$(jQuerySelector).sheet({
urlGet: "Address_of_my_sheet.html",
urlSave: "Address_of_my_sheet_savepage.php"
});
});
Open a sheet for viewing only:
$(document).ready(function() {
$(jQuerySelector).sheet({
urlGet: "Address_of_my_sheet.html",
editable: false,
menu: false
});
});
Open a sheet for editing, but all functions are locked:
$(document).ready(function() {
$(jQuerySelector).sheet({
urlGet: "Address_of_my_sheet.html",
lockFormulas: true
});
});
Basic initialization:
$(document).ready(function() {
$(jQuerySelector).sheet();
});
Make a new sheet (10 Columns by 30 Rows):
$(document).ready(function() {
$(jQuerySelector).sheet({
buildSheet: '10x30'
});
});
Turn your table housed by a div into a sheet:
$(document).ready(function() {
$(jQuerySelector).sheet({
buildSheet: true
});
});
Open a sheet for edit & set it's save location:
$(document).ready(function() {
$(jQuerySelector).sheet({
urlGet: "Address_of_my_sheet.html",
urlSave: "Address_of_my_sheet_savepage.php"
});
});
Open a sheet for viewing only:
$(document).ready(function() {
$(jQuerySelector).sheet({
urlGet: "Address_of_my_sheet.html",
editable: false,
menu: false
});
});
Open a sheet for editing, but all functions are locked:
$(document).ready(function() {
$(jQuerySelector).sheet({
urlGet: "Address_of_my_sheet.html",
lockFormulas: true
});
});