Search code examples
sqliteelectronbootstrap-table

Display db file data into table in electron


I'm using Electron to develop a desktop application.The table needs to be displayed on the page, and the data source of the table is a DB file.I built the table on the page, used SQlite3 to read the data in the DB , but I don't know how to put the data in the table on the page.This is my code for creating the table.

<script type="text/javascript">
      $(function () {
        $("#myTable").bootstrapTable("destroy");
        $("#myTable").bootstrapTable({
          url: "json.json", 
          dataField: "rows", 
          search: true, 
          pagination: true, 
          pageSize: 20, 
          pageList: [5, 10, 20, 50],
          pageNumber: 1, 
          smartDisplay: false,
          sidePagination: "client", 
          contentType: "application/json", 
          dataType: "json",
          method: "post", 
          searchAlign: "right", 
          queryParamsType: "limit", 
          queryParams: function getParams(params) {
            params.other = "otherInfo";
            return params;
          },
          searchOnEnterKey: false, 
          showRefresh: true, 
          showColumns: true, 
          buttonsAlign: "center",
          toolbar: "#toolbar", 
          toolbarAlign: "right", 
          columns: [
            {
              title: "check",
              field: "check",
              checkbox: true,
              width: 20, 
              align: "center", 
              valign: "middle", 
            },
            {
              title: "CollectTime",
              field: "CollectTime", 
              sortable: true, 
              order: "desc", 
            },
          ],
          locale: "zh-CN",  
        });
      });
    </script>

This is the code that reads db data Open test.db using the SQlite3 module

var sqlite3 = require("sqlite3").verbose();
const path = require("path");
var db = new sqlite3.Database(path.join(__dirname, "test.db"));

Reference the DB.js file and read all the data

<script src="./db.js"></script>
    <script type="text/javascript">
      function getData() {
        db.all("select * from DataGrpData", function (err, res) {
          if (!err) {
            var content = JSON.stringify(res); 
            console.log(content)         
          } else {
            console.log(err);
          }
        });
      }
      getData();
    </script>

Solution

  • $("#myTable").bootstrapTable("destroy");
      $("#myTable").bootstrapTable({
        toolbar: "#toolbar",
        data: res,
        columns: columns,
        pagination: true, 
        pageSize: 20, 
        pageList: [5, 10, 20, 50], 
        pageNumber: 1, 
        locale: "zh-CN", 
        searchOnEnterKey: false, 
        showRefresh: true, 
        showColumns: true, 
        buttonsAlign: "center", 
        
      });
    

    Just put the results(res) in the data