0

I am currently using flask and I aim to do the following:

When I click on a tab on my webpage constructed by HTML, I want it to display a list of data stored in mysql server.

I know how to pull the data from sql in Python (using mysql connector) and then 'input' the values individually, however, this would require me to create another webpage with the sole objective of displaying data from that particular tab - and then I'd have to create a new webpage altogether for another tab.

This seems really inefficient and was wondering if there is a way of displaying data from sql when pressing a tab without needing to navigate to another page.

Code

Python:

@app.route('/studentdb')
def sdb():
    return render_template('studentdb.html')

HTML (studentdb.html)

<!DOCTYPE html>
<html lang="en">
<head>
<html lang="en">
        <link rel="stylesheet" type="text/css" href="{{url_for('static',filename='css/style_sdb.css')}}">
        <title>Student Database</title>
    </head>

<body>
    
    <div class="tab">
      <button class="tablinks" onclick="openSubject(event,'bio')">Biology</button>
      <button class="tablinks" onclick="openSubject(event, 'chem')">Chemistry</button>
      <button class="tablinks" onclick="openSubject(event, 'phy')">Physics</button>
    </div>

    <div id="bio" class="tabcontent">
          <h3>Biology</h3>
          <p>Biology Students List</p>
    </div>
        
    <div id="chem" class="tabcontent">
          <h3>Chemistry</h3>
          <p>Chemistry Students List</p>
    </div>

    <div id="phy" class="tabcontent">
          <h3>Physics</h3>
          <p>Physics Students List</p>
    </div>
        
    <script src="static/js/tabs.js"></script>
    
    </body>
    
</html>

There are also css and javascript code for the tabs that I have not included - I'm happy to post them if required.

Improve this question
5
  • what do you mean when you say " 'input' the values individually" and have you tried the solution on: stackoverflow.com/questions/45558349/… Commented Jun 24, 2020 at 13:03
  • Whilst reading that, I thought of a solution - perhaps I could get the data ready beforehand, that is, get the list for each subject's students and pass them on as a parameter in render_template() (i.e. render_template(student_db.html, bio_list = bio_list...)) - so that when I click on each individual tab, the data would have already been processed Commented Jun 24, 2020 at 13:23
  • But to answer your initial question, what I meant was using a for loop in html (using flask) for each individual list Commented Jun 24, 2020 at 13:25
  • But it seems that I have answered my own question - thanks! Commented Jun 24, 2020 at 13:25
  • if your solution works please post it as an answer so others can see how you solved this problem in more depth - thanks Commented Jun 24, 2020 at 13:29
Related questions
1
Data from SQLITE to an HTML table in a Flask page
1
how to display data from MySql db to html pages in python
0
Retrieve record from SQL database and print in HTML (via Python)
Load 7 more related questions Show fewer related questions

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.