JSFiddle - React, Tailwind, and code Playground

HTML

<form method="POST">
<label for="id">ID:</label>
<input type="text" class="form-control"  id="id" name="id" required>
<label for="name">Name:</label>
<input type="text" class="form-control" id="name" name="name" required>
<button type="submit" class="btn btn-info pull-right"   id="sub">Submit</button>
</form>

JavaScript

$("form").on("submit", function(ev){
    ev.preventDefault(); //prevent regular form submission via a page reload
  	
    var sendf = $(this).serialize(); // much easier way to generate the data from the form
    
    $.ajax({
           type: "POST",
           url: "https://httpbin.org/post",
           data: sendf,
           dataType: "text",
            headers: {
                      'Accept': 'application/json',
                      'Content-Type': 'application/x-www-form-urlencoded'
            },
            success: function(response, status, xhr) {                                                             
              	console.log(response);
            },

     	}); //ajax ends
});//sub click ends