title: Make a Post request with request body from HTML form
body: <p>I am working on a html page which is supposed to submit a post request with request body to my server like below</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;Customer app&lt;/head&gt;
      &lt;body&gt;
           &lt;div&gt; 
               &lt;table&gt; 
                   &lt;tr&gt;
                       &lt;td&gt;Customer Id :&lt;/td&gt; 
                       &lt;td&gt;
                           &lt;form name="submitform" method="post"&gt;
                               &lt;input type="text" id="customerId" name="customerId"/&gt;
                               &lt;input type="submit" value="Submit"&gt;
                           &lt;/form&gt;
                       &lt;/td&gt;
                   &lt;/tr&gt;
               &lt;/table&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  
      &lt;script&gt;
      $(document).ready(function(){
          $("#submitform").click(function(e)
          {
              var MyForm = JSON.stringify($("#customerId").serializeJSON());
              console.log(MyForm);
              $.ajax({
                  url : "http://localhost:7777/ola-drive/customer/ride",
                  type: "POST",
                  data : MyForm,
  
              });
              e.preventDefault(); //STOP default action
  
          });
      });
      &lt;/script&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>It does not work as expected throwing 404 Not Found getting redirected to <a href="http://localhost:7777/customerapp.html" rel="nofollow noreferrer">http://localhost:7777/customerapp.html</a>. But form data corresponding to the request submission seems to be correct.</p>
  
  <p>Can someone help me fix the issue with my html code submit POST request redirection ?</p>