title: Why is my form.action different than what gets submitted by the form?
body: <p>I am trying to set up a form to transfer data to my php file via forms filled out by the user. I want to create my own GET request so simplify it, but when i submit my form it is a different URL than the one i created.</p>
  
  <p>I console logged my form.action and got (both fabricated data):</p>
  
  <p>.../index.php?search1=987654321&amp;search2=987654321</p>
  
  <p>but the URL i got was (i inputted 987654321):</p>
  
  <p>/index.php?search1=987654321</p>
  
  <p>File: index.html</p>
  
  <pre><code>&lt;form id="searchForm" action="/index.php" method="GET"&gt;
      &lt;input type="submit" value="Search" onclick="createActionGetRequest()"&gt;
      &lt;br&gt;&lt;br&gt;
      &lt;text id="search1Text"&gt;Social Security Number&lt;/text&gt;&lt;input id="searchField1" type="text" name="search1"&gt;&lt;br&gt;
      &lt;text id="search2Text"&gt;&lt;/text&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>File: helper-functions.js</p>
  
  <pre><code>function createActionGetRequest()
  {
    var form = document.getElementById("searchForm");
    var elements = form.elements;
    var values = [];
  
    for (var i = 0; i &lt; elements.length; i++)
    {
      values.push(encodeURIComponent(elements[i].name) + '=' + encodeURIComponent(elements[i].value));
    }
  
    var userForm = document.getElementById("userType");
    values.push(encodeURIComponent("userType") + '=' + encodeURIComponent(userForm.value));
  
    var searchForm = document.getElementById("searchType");
    values.push(encodeURIComponent("searchType") + '=' + encodeURIComponent(searchForm.value));
  
    // dummy test for GET request
    form.action += '?' + "search1=987654321" + '&amp;' + "search2=987654321";
    console.log(form.action);
    alert('pause');
    form.submit();
  }
  </code></pre>