# return submit form including custom input created from ajax

**URL:** <https://forum.djangoproject.com/t/return-submit-form-including-custom-input-created-from-ajax/39086>\
**Category:** Forms & APIs\
**Created:** [February 24, 2025, 12:07pm UTC](https://forum.djangoproject.com/t/return-submit-form-including-custom-input-created-from-ajax/39086 "2025-02-24T12:07:35Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![denissanga](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.djangoproject.com/denissanga/32/25779_2.png) [@denissanga](https://forum.djangoproject.com/u/denissanga)\
**Post date:** [February 24, 2025, 12:07pm UTC](https://forum.djangoproject.com/t/return-submit-form-including-custom-input-created-from-ajax/39086/1 "2025-02-24T12:07:35Z")

</div>

hi all,  
I have an html page where I have a form created in view.py file and forms.py and additionally an ajax code create some input fields.  
I would like that when I submit, the input value created from ajax are automatically sent to view.py with post request.  
it could be simply return as a json data {[‘question’:‘…’,‘answer’:‘…’],…}  
How can I do that?

```auto
 
</div><!--column2-->
<form method="post" enctype="multipart/form-data">
  {% csrf_token %}
  <div class="container register-form">
    <div class="form">
      <div class="note">
        <p>INSERIMENTO NUOVA VISITA</p>
      </div>
      <div class="form-content">

        <div class="row">
          <div class="col-md-6">
            <p>Data</p>
            <div class="form-group">
              {% render_field visitaForm.data class="form-control" placeholder="data" %}
            </div>
            <p>Titolo</p>
            <div class="form-group">
              {% render_field visitaForm.title class="form-control" placeholder="titolo" %}
            </div>
          </div><!--column1-->

          <div class="col-md-6">
            <div class="form-group">
              <body>
                <select class="js-example-basic-single" name="scoreList" id="scoreList" style="width: 200px;">
                  <optgroup label="Existing scores">
                    {% for u in scoreList %}
                    <option value="{{ u.id }}">{{ u.title }}</option>
                    {% endfor %}
                </optgroup>  
                </select>
              </body>
            </div>

            <div id="score">
              <p id="question"></p>
              <input id="answer"></input>
            </div>
          </div>
        </div>
        <button type="submit" class="btnSubmit">Admit</button>
      </div><!--form-content-->
    </div><!--row-->
    </div><!--form-->
  </div><!--container register-form-->
</form>
<script src="https://code.jquery.com/jquery-3.5.1.js" integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc=" crossorigin="anonymous"></script>
<script>
  $(document).ready(function() {

    $("#scoreList").change(function () {
      var pageURL = $(location).attr("href");
        const scoreListId = $(this).val(); // get the selected subject ID from the HTML dropdown list 
        
        let scoreInput = document.getElementById('score')
        scoreInput.innerHTML='';
        $.ajax({ // initialize an AJAX request
            type: "GET",
            url: pageURL,
            data: {
                'scoreList_id': scoreListId,
                'csrfmiddlewaretoken': '{{ csrf_token }}',
            },
            datatype:'json',
            success: function(data){
              newRowAdd = '';

            
              let i = 0
              data.scoreQuestion.forEach(element => {
                i = i + 1
                newRowAdd = newRowAdd +
                    '<p>' + element.domanda + '</p>' +
                    '<input id="' + 'answer' + String(i) + '" type="text" class="form-control">'

              });
              $("#score").append(newRowAdd);

            }
        });
    });
  });
</script>

```

many thanks in advance

---

<div class="post-metadata">

**Author:** ![philgyford](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.djangoproject.com/philgyford/32/14295_2.png) [@philgyford](https://forum.djangoproject.com/u/philgyford)\
**Post date:** [February 25, 2025, 4:10pm UTC](https://forum.djangoproject.com/t/return-submit-form-including-custom-input-created-from-ajax/39086/2 "2025-02-25T16:10:49Z")

</div>

When the form is submitted, the browser and the view don’t know or care whether the form’s input fields were created using JavaScript or not. Any `<input>` or similar fields will be submitted.

However, the Django view and form will need to be prepared to handle the fields that the JavaScript created – presumably it won’t by default “know” about these because they weren’t defined in your Django Form.

To help further, we’d need to see the code for the view and form.
