I have a flask web app with a json file with data that I want to display in a bootstrap table. I have tried many things but I have not been able to get my data to load into the table. Only the table headers appear.
Here is my HTML
<!DOCTYPE html>
<html lang="en">
<head>
<title>Tools</title>
<meta charset="utf-8">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css">
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/bootstrap-table.min.css">
</head>
<body>
{% extends "template.html" %}
{% block content %}
<h1>Recon</h1>
<table data-toggle="table" class="display table table-bordered" data-url="static/tools.json" data-height="299">
<thead>
<tr>
<th data-field="Name">Name</th>
<th data-field="Description">Description</th>
<th data-field="Link">Data Link</th>
<th data-field="Language">Language</th>
<th data-field="Maintained">Maintained</th>
<th data-field="Stars">Stars</th>
<th data-field="Author">Author</th>
</tr>
</thead>
</table>
{% endblock %}
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/bootstrap-table.min.js"></script>
</body>
</html>
And here is an example of my json data
[
{
"id": "1",
"name": "Inspy",
"description": "A python based LinkedIn enumeration tool",
"link": "https://github.com/leapsecurity/InSpy",
"language": "Python",
"maintained": "No",
"stars": "348",
"author": "Leap Security"
},
{
"id": "2",
"name": "AWSBucketDump",
"description": "Security Tool to Look For Interesting Files in S3 Buckets",
"link": "https://github.com/jordanpotti/AWSBucketDump",
"language": "Python",
"maintained": "No",
"stars": "889",
"author": ""
}
]
