How to display data in SlickGrid from a SQL database

Home > Search > How-to
  by

If using Visual Studio (ASP.NET):

Create a SQL connection:

  1. From Toolbox, drag SQL Datastore into Design View
  2. In Design View, select Configure Data Source
  3. In the Choose Data Source dialog box, select a connection string and select Next
  4. Follow the prompts to select some data from a SQL database table

 

 


If using PHP, let's grab some data from a SQL database and display the data in the table.

<?php
$data = '';
$i = 0;

$con = new mysqli('sql_domain', 'sql_username', 'sql_password', 'database');
$sql = "select * from tablename";
$sql_query = mysqli_query($con, $sql);

while ($row = mysqli_fetch_array($sql_query)) {
  $data .= '
    data['.$i.'] = {
    title: "'.$row['title'].'",
    newcolumn: "'.$row['newcolumn'].'"
    };
  ';
$i++;
}
?>

<script>
  var grid;
  var columns = [
    {id: "title", name: "Title", field: "title"},
    {id: "newcolumn", name: "New Column", field: "newcolumn"}
  ];

  var options = {
    enableCellNavigation: true,
    enableColumnReorder: false
  };


  $(function () {
   var data = [];
     <?php echo $data; ?>

     grid = new Slick.Grid("#myGrid", data, columns, options);
  })
</script>

 



Add a Comment




We will never share your name or email with anyone. Enter your email if you would like to be notified when we respond to your comment.




Please enter in the box below so that we can be sure you are a human.




Comments