title: How to send a JavaScript object along with an html form?
body: <p>I have an HTML form, which has quite a few input fields. As the user types in one of them, JavaScript generates a few objects that contain data I need to get to the server. I know I can send these objects with AJAX, but I need them to end up in the same function as the normal data from the form once they get server-side (I'm using flask for the backend). Is there any way I can send the objects along with the form, so that they somehow end up in the same place?</p>
  <p>Here is the beginning of the form:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;form action=&quot;/org/new-task&quot; method=&quot;post&quot;&gt;
      &lt;div class=&quot;mb-3&quot;&gt;
          &lt;select name=&quot;rep-type&quot; class=&quot;form-select&quot;&gt;
              &lt;option selected disabled&gt;Type of task&lt;/option&gt;
              &lt;option value=&quot;0&quot;&gt;Ongoing/repeating&lt;/option&gt;
              &lt;option value=&quot;1&quot;&gt;One-off&lt;/option&gt;
          &lt;/select&gt;
      &lt;/div&gt;
      ...
  </code></pre>
  <p>and here is the output when I <code>console.log()</code> one of the objects (there are multiple, but they are very similar):</p>
  <pre><code>(2) [&quot;painting&quot;, &quot;cleaning&quot;]
  </code></pre>