Time for action — creating a basic data grid
Let's take a look at how to turn a basic HTML table into an interactive data grid:
- We'll get started as usual with our basic HTML file and associated files and folders, just like we did in Chapter 1, Designer, Meet jQuery. We'll fill the
<body>of our HTML document with the HTML markup for a large table of data. The DataTables plugin does require that we are careful and correct with our table markup. We'll need to be sure to use a
<thead>element for the table's header, and a
<tbody>element for the table's body. A
<tfoot>element for the table footer is optional. Here's an abbreviated sample of the HTML markup for a table of the all-time best-selling books:
<table id="book-grid"> <thead> <tr> <th>Title</th> ...