JQuery Sheet - Creating a small, simple table

Question

I'm trying to figure out how to use jQuery.sheet, available here:

http://visop-dev.com/Project+jQuery.sheet

The demo of this spreadsheet component looks good, and I'm putting together a very simple proof of concept that runs locally. It should be simple, I just have to create a table in a div and pass it to the sheet() function. However, I cannot manage to transform even a simple table into a spreadsheet. I have this Javascript code:

$(function() {
  $("#jqsheet1").sheet(
    {
      title: 'Spreadsheet 1',
      buildSheet: '5x5',
      editable: true
    }
});

And in the HTML body I have this:

<div id="jqsheet1" class="jQuerySheet" style="height: 450px;">
  <table title="Spreadsheet 1">
    <tbody>
      <tr>
        <td>
          1
        </td>
        <td>
          2
        </td>

... and so on for five rows by five columns. The JS files jquery.js, jquery.sheet.js and parser.js are all present in the local directory and loaded in the head of the document.

What I actually get when I load the HTML file is a plain boring table, with no spreadsheet controls. Clearly I am doing something wrong. What is it?

Does anyone have any link to a simple tutorial? I am trying to follow jquery.sheet.html, included with the download, but without much success.

Answer 1

You have an error in your js code, this should work:

$(function() {
  $("#jqsheet1").sheet(
  {
    title: 'Spreadsheet 1',
    buildSheet: '5x5',
    editable: true
  });
});