Home > Software design >  How to nav-tabs works like button by html, js, jinja, flask or any other method?
How to nav-tabs works like button by html, js, jinja, flask or any other method?

Time:09-29

In main.html:

I have buttons:

<form name='text' action='' method="POST">
  <textarea name="text" class="form-control custom-control" rows="3">insert text here</textarea>
    <div style="text-align: center; margin: 10px;">
      <input type="submit" name="submit_button" class="btn btn-primary" value="Work-1"" />
      <input type="submit" name="submit_button" class="btn btn-primary" value="Work-2"/>
    </div>
</form>

and I have tabs:

<ul class="nav nav-tabs nav-justified">
  <li role="presentation" class="active"><a href="result-1.html">Work-1</a></li>
  <li role="presentation"><a href="result-2.html">Work-2</a></li>
</ul>

In Python flask:

if request.method == 'POST':
    if request.form['submit_button'] == 'Work-1':
        text = request.form['text']
        return render_template("result-1.html", text=text)
    
     elif request.form['submit_button'] == 'Work-2':
        text = request.form['text']
        return render_template("result-2.html", text=text)

How do nav-tabs works like button by html, js, jinja, or flask?

CodePudding user response:

With flask, your setup should have multiple routes for each page. Each route is defined with @app.route(‘/page_name’)

Then, from there you can have so called ‘tabs’ or sub pages with @app.route(‘/page_name/tab_name’)

In your html, you will redirect to the tab name with clicking on the tab, and redirect to the page name for the navbar.

  • Related