How can we pass the data via POST while using boostrap nav tabs?

Question

I have the following code in python:

@app.route("/request_exp", methods=["GET", "POST"])
@login_required
def request_exp():
    """Enter a development request"""
    if request.method == "POST":
        # Get company name from request_ext
        company = request.form.get("company")
        return redirect("/")

    else:
        # If request.method == "GET":
        company_list = db.execute("SELECT id, company FROM customers ORDER BY company")
        return render_template("request_exp.html", company_list=company_list)

Also the following template:

{% extends "layout.html" %}

{% block title %}
Request
{% endblock %}

{% block main %}
<!--Nav Tabs-->
<ul class="nav nav-tabs" id="myTab" role="tablist">
    <li class="nav-item" role="presentation">
      <button class="nav-link active" id="company-tab" data-bs-toggle="tab" data-bs-target="#company" type="button" role="tab" aria-controls="company" aria-selected="true">Company</button>
    </li>
    <li class="nav-item" role="presentation">
      <button class="nav-link" id="address-tab" data-bs-toggle="tab" data-bs-target="#address" type="button" role="tab" aria-controls="address" aria-selected="false">Address</button>
    </li>
    <li class="nav-item" role="presentation">
      <button class="nav-link" id="contact-tab" data-bs-toggle="tab" data-bs-target="#contact" type="button" role="tab" aria-controls="contact" aria-selected="false">Contact</button>
    </li>
    <li class="nav-item" role="presentation">
        <button class="nav-link" id="development-tab" data-bs-toggle="tab" data-bs-target="#development" type="button" role="tab" aria-controls="development" aria-selected="false">Development</button>
      </li>
  </ul>

<!--Nav Tab-->
  <div class="tab-content" id="myTabContent">
        <!-- Select Company from the Company Tab -->
    <div class="tab-pane fade show active" id="company" role="tabpanel" aria-labelledby="company-tab">
        <h2>Please select company from list or add new:</h2>
        <form action="/request_exp" method="POST">
            <div class="mb-3">
                <select class="form-select w-auto mx-auto" name="company">
                    <option disabled selected>Company...</option>
                    {% for row in company_list %}
                    <option value="{{  row.id  }}">{{ row.company }}</option>
                    {% endfor %}
                </select>
            </div>
            <!--Select customer from drop down list-->
            <div button class="btn btn-primary" type="submit">Select</button>
            </div>
            <!--Need to add ability to add new customer, TODO add html link to a pop up customer entry form-->
            <div>
                <p></p>
                <a class="btn btn-primary" href="#" role="button">Add New</a>
            </div>
    </div>


    <div class="tab-pane fade" id="address" role="tabpanel" aria-labelledby="address-tab">address</div>
    <div class="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">contact</div>
    <div class="tab-pane fade" id="development" role="tabpanel" aria-labelledby="development-tab">development</div>
  </div>

{% endblock %}

I am trying to pass "company" from a select list on the first tab back to the server after clicking the submit button. Nothing happens.

I have tried removing the tabs and just doing a basic drop down list and everything works fine.

Thank you for any assistance.