From ecbc5f9162c0ac1a6a773c50642cfa1094cc7543 Mon Sep 17 00:00:00 2001 From: Yarne Coppens Date: Sun, 11 Aug 2024 10:06:27 +0200 Subject: [PATCH] Turned table into a bootstrap datatable --- app.py | 2 +- static/main.js | 34 +++++++++++++++++++++++++--------- templates/base.jinja | 9 ++++++++- templates/owned.jinja | 1 + 4 files changed, 35 insertions(+), 11 deletions(-) diff --git a/app.py b/app.py index a73aa3f..0f62dda 100644 --- a/app.py +++ b/app.py @@ -1,4 +1,4 @@ -from flask import Flask, render_template, request, escape +from flask import Flask, render_template, request app = Flask(__name__) diff --git a/static/main.js b/static/main.js index ea637d4..19276c2 100644 --- a/static/main.js +++ b/static/main.js @@ -34,17 +34,33 @@ function add_boardgame_row(html_tbody, boardgame_json) { async function loadOwnedGames() { - - var loadGamesURL = api_url + '/owned' - all_owned_games = await makeRequest(loadGamesURL) + new DataTable('#boardgame_table', { + order: [[1, 'asc']], + ajax: { + url: api_url + '/owned', + dataSrc: '' + }, + columns: [ + { + data: 'thumbnail_url', + render: function (data,type){ + return '' + } + }, + { + data: 'name' + }, + { + data: 'description' + }, + { + data: 'weight' + } + + ] + }); - console.log("Loaded owned games:", all_owned_games) - var boardgame_tbody = document.getElementById("boardgame_table_tbody") - - for (index = 0; index < all_owned_games.length; index++) { - add_boardgame_row(boardgame_tbody, all_owned_games[index]) - } } async function loadGame() { diff --git a/templates/base.jinja b/templates/base.jinja index a91e128..0199921 100644 --- a/templates/base.jinja +++ b/templates/base.jinja @@ -6,9 +6,16 @@ Boardgame Site - + + + + + + + + {% block body %} diff --git a/templates/owned.jinja b/templates/owned.jinja index 8f276cf..eb0dfe3 100644 --- a/templates/owned.jinja +++ b/templates/owned.jinja @@ -5,6 +5,7 @@ +