0

newbie to stack overflow, doing my best to ask this question correctly.

aim:

  1. to display the contents of a mysql database via slickgrid in an html page.
  2. to be able to style this grid with a theme from the jquery ui theme roller.
  3. to be able to edit and add records to the database via this interface.

research:

i have looked for all the major 'grid' apps and came across:

  • phpgrid
  • jqgrid
  • datatables
  • flexigrid

and also browsed through a list of grids here:

and read that the jquery ui team were actually going to release their own grid but it is on pause at the moment.

so with that research i decided on slickgrid because people have said it is fast and i like the clean layout and the fact that it can be skinned with jquery ui (and it is free).

most of the syntax and methods i have found for getting data from a database using slickgrid i can not understand (newbie in these areas to) but the closest i found to a set of 'instructions' was here:

SlickGrid AJAX data

however i get stuck at step 5.

so i guess this post is asking, can anyone please provide step-by-step instructions for a newbie on how to:

  1. display the contents of a mysql database via slickgrid in an html page.
  2. be able to edit and add records to the database via this interface.

i have downloaded the zip file from slickgrid github page which contains the existing examples.

thank you!

ps i had links to all apps and sources mentioned but as a new user was not able to post more than two links.

Community
  • 1
  • 1
user1063287
  • 10,265
  • 25
  • 122
  • 218
  • Try [carbogrid](http://www.carbogrid.com) if you are familiar with codeigniter. This is easier to understand and has many inbuilt features – Bhuvan Rikka Sep 14 '12 at 12:45
  • thank you very much Bhuvan. i have downloaded carbogrid and the code is very well presented and commented. the 'sample' folder which is shown on their website is not in the downloadable zip though, any ideas how to get the samples working? thanks! – user1063287 Sep 14 '12 at 14:51
  • You can get the source code at the end of every sample. – Bhuvan Rikka Sep 14 '12 at 14:53
  • thank you again Bhuvan, i do not know how to implement the source code that is shown after each example at http://carbogrid.com/index.php/sample/home as it does not show the full code only the logic of how the code operates for those who know how to implement it. i have tried copying and pasting it into a php file but i get 'No direct script access allowed' errors etc. carbogrid's website has a directory with all the demo's in it called 'sample'. carbogrid's download folder, and the source code at google, does not contain this folder unfortunately, so i don't know how to implement it. – user1063287 Sep 15 '12 at 01:30
  • i think i've isolated the problem, in the downloadable zip file, in the location /application/views/header.php, there are references to the 'sample' folder. these need to be changed as the 'sample' folder does not exist, but i don't know how to do it yet. – user1063287 Sep 15 '12 at 03:21

1 Answers1

0

In the end it all boils down to displaying data in a table. All the grid pick up a table from the DOM, and 'enhance' them.

As a newbie, before setting up a page with a JQuery/Javascript grid, I would suggest first make a it work as a 'normal' table. When that is all working, its easier to understand what the grids do.

This should get you going:

 <table>
    <?
    $entries = $this->model->FindAll();
    if ( $entries )
      foreach ( $entries as $entry ) {
        ?>
        <tr>
          <td><?= $entry['admid'] ?></td>
          <td><?= $entry['admname'] ?></td>
          <td><?= $entry['admemail'] ?></td>
        </tr>
        <?
      }
    ?>
  </table>

I had some good results with 'Datatables.net', but most grids only differ in ease of configuration and feature set.

JvdBerg
  • 21,777
  • 8
  • 38
  • 55