Django POST method is not receiving all input fields from HTML

please I would like to ask for help. I'm creating a web-based application and I'm having a hard time when I try to get the data from the HTML form and receive it through the POST method in Django. It's pulling data only from one field and I really appreciate your help in figuring out why it's not pulling information from the other fields only from the location field. Thank you very much!

HTML = create-request.html

        <form action="{% url 'save_request' %}" id="checklistForm" name="checklistForm" enctype="multipart/form-data" method="POST">
          {% csrf_token %}
          <section id="step-1" class="form-step">
            <div class="mt-3">
              {% include 'home/1_resource-request.html' %}
            </div>
          </section>
        </form>

HTML = home/1_resource-request.html

{% block stylesheets %}{% endblock stylesheets %} {% block content %}

<div class="pcoded-content">
  <div class="pcoded-inner-content">
    <div class="main-body">
      <div class="page-wrapper">
        <div class="row">
          <div class="col-sm-12">
            <div class="card">
              <div class="card-header">
                <h5>Resource Request</h5>
              </div>
              <div class="card-body">
                <div class="row">
                  <div class="col-md-6">
                    <form>
                      <div class="form-group">
                        <label for="checklistID">Checklist Number</label>
                        <input type="text" class="form-control" id="checklistID" name="checklistnum" placeholder="123456" disabled/>
                      </div>
                      <div class="form-group">
                        <label for="location_ID">CMPA Location</label>
                        <select class="form-control" id="location_ID" name="location">
                          <option selected>Select</option>
                          <option>Brazil</option>
                          <option>Canada</option>
                          <option>Mexico</option>
                          <option>SSA</option>
                          <option>United States</option>
                        </select>
                      </div>
                    </form>
                  </div>
                  <div class="col-md-6">
                    <form>
                      <div class="form-group">
                        <label for="support_id">CMPA Support Needed</label>
                        <select class="form-control" id="support_id" name="support">
                          <option selected>Select</option>
                          <option>Both</option>
                          <option>PMA - Financial Management</option>
                          <option>PMO - Project Administration</option>
                        </select>
                      </div>
                      <div class="form-group">
                        <label for="band_pma_id">Band (PMA)</label>
                        <select class="form-control" id="band_pma_id" name="band_pma">
                          <option selected>Select</option>
                          <option>4</option>
                          <option>5</option>
                          <option>6</option>
                          <option>7</option>
                        </select>
                        <small id="textInfo1" class="form-text text-muted">There is no B4 for US and CA - in progress.</small>
                      </div>
                      <div class="form-group">
                        <label for="band_pmo_id">Band (PMO)</label>
                        <select class="form-control" id="band_pmo_id" name="band_pmo">
                          <option selected>Select</option>
                          <option>4</option>
                          <option>5</option>
                          <option>6</option>
                          <option>7</option>
                        </select>
                        <small id="textInfo2" class="form-text text-muted"
                          >There is no B4 for US and CA - in progress.</small
                        >
                      </div>

                      <div class="mt-3">
                        <button class="button btn-navigate-form-step" type="button" step_number="2">Next</button>
                        <button class="button2 btn btn-outline-primary " type="submit">Save</button>
                      </div>

                    </form>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

    {% endblock content %}
 

Django/Python = views.py

def save_request(request):
    #print(request.POST)
    if request.method == 'POST':
        context = {}
        location = request.POST.get('location', None)
        support = request.POST.get('support', None)
        band_PMA = request.POST.get('bandPMA', None)
        band_PMO = request.POST.get('bandPMO', None)
        ippf = request.POST.get('ippf', None)
        print(location, support, band_PMA, band_PMO, ippf)
    return render(request, 'home/create-request.html', context=context)

That html defines many different forms. The first form has the location input element, the second form has the support input element, and so on.

Only one form can be submitted at a time. By default it is the first form on the page, so that's why you only see the location element.

I think you need to rewrite the html to have only one form.

That is because you have many tags.

You need to keep only one, the one wrapping your include, so do that :

<form action="{% url 'save_request' %}" id="checklistForm" name="checklistForm" enctype="multipart/form-data" method="POST">
      {% csrf_token %}
      <section id="step-1" class="form-step">
        <div class="mt-3">
          {% include 'home/1_resource-request.html' %}
        </div>
      </section>
    </form>

and that :

 HTML = home/1_resource-request.html

{% block stylesheets %}{% endblock stylesheets %} {% block content %}

<div class="pcoded-content">
  <div class="pcoded-inner-content">
    <div class="main-body">
      <div class="page-wrapper">
        <div class="row">
          <div class="col-sm-12">
            <div class="card">
              <div class="card-header">
                <h5>Resource Request</h5>
              </div>
              <div class="card-body">
                <div class="row">
                  <div class="col-md-6">
                    
                      <div class="form-group">
                        <label for="checklistID">Checklist Number</label>
                        <input type="text" class="form-control" id="checklistID" name="checklistnum" placeholder="123456" disabled/>
                      </div>
                      <div class="form-group">
                        <label for="location_ID">CMPA Location</label>
                        <select class="form-control" id="location_ID" name="location">
                          <option selected>Select</option>
                          <option>Brazil</option>
                          <option>Canada</option>
                          <option>Mexico</option>
                          <option>SSA</option>
                          <option>United States</option>
                        </select>
                      </div>
                    
                  </div>
                  <div class="col-md-6">
                    
                      <div class="form-group">
                        <label for="support_id">CMPA Support Needed</label>
                        <select class="form-control" id="support_id" name="support">
                          <option selected>Select</option>
                          <option>Both</option>
                          <option>PMA - Financial Management</option>
                          <option>PMO - Project Administration</option>
                        </select>
                      </div>
                      <div class="form-group">
                        <label for="band_pma_id">Band (PMA)</label>
                        <select class="form-control" id="band_pma_id" name="band_pma">
                          <option selected>Select</option>
                          <option>4</option>
                          <option>5</option>
                          <option>6</option>
                          <option>7</option>
                        </select>
                        <small id="textInfo1" class="form-text text-muted">There is no B4 for US and CA - in progress.</small>
                      </div>
                      <div class="form-group">
                        <label for="band_pmo_id">Band (PMO)</label>
                        <select class="form-control" id="band_pmo_id" name="band_pmo">
                          <option selected>Select</option>
                          <option>4</option>
                          <option>5</option>
                          <option>6</option>
                          <option>7</option>
                        </select>
                        <small id="textInfo2" class="form-text text-muted"
                          >There is no B4 for US and CA - in progress.</small
                        >
                      </div>

                      <div class="mt-3">
                        <button class="button btn-navigate-form-step" type="button" step_number="2">Next</button>
                        <button class="button2 btn btn-outline-primary " type="submit">Save</button>
                      </div>

                    
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

    {% endblock content %}
 
Back to Top