JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<form id="registerForm">
<input type="text" pattern="[A-Za-z]{1,20}" placeholder="First Name" name="guestFName" title="Up to 20 alphabetical characters" required>
<input type="text" pattern="[A-Za-z]{1,20}" placeholder="Last Name" name="guestLName" title="Up to 20 alphabetical characters" required>
<input type="email" placeholder="Email" name="guestEmail" title="Must be a valid email address" required>
<input type="text" pattern="08[36579]-\d{7}" placeholder="Phone Number" name="guestPhone" title="Must be an irish mobile number of format 08?-7 digits" required>
<input type="password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,20}" placeholder="Password" name="guestPassword" title="Must be 8 or more characters long and contain at least one number and one uppercase letter" required>
<br>
<button id="myButton">Register</button>
</form>
JavaScript
$(function() {
$("#registerForm").submit(function(e) {
e.stopPropagation();
e.preventDefault();
$.ajax({
url: "https://httpbin.org/post",
data: $('#registerForm').serialize(),
type: 'POST'
})
.done(function(response) {
console.log(response);
//var result = JSON.parse(response);
});
});
});