JSFiddle - React, Tailwind, and code Playground
HTML
<div class="form">
<form method="post" accept-charset="utf-8" class="form-horizontal" action="">
<div class="form-group form-group">
<label class="col-sm-4 control-label" for="username">Username:</label>
<div class="col-sm-4">
<input class="form-control" type="text" id="username" placeholder="john.doe" value="">
</div>
<div class="col-sm-4"></div>
</div>
<div class="form-group form-group">
<label class="col-sm-4 control-label" for="password">Password:</label>
<div class="col-sm-4">
<input class="form-control" type="password" id="password" placeholder="Password" value = "">
<div class="col-sm-4"></div>
</div>
</div>
<div class="form-group form-group">
<label class="col-sm-4 control-label" for="firstname">First Name:</label>
<div class="col-sm-4">
<input class="form-control" type="text" id="firstname" placeholder="John" value= "">
</div>
<div class="col-sm-4"></div>
</div>
<div class="form-group form-group">
<label class="col-sm-4 control-label"...
JavaScript
$(document).ready(function()
{
$("#register").click(function()
{
var username = $("#username").val();
var password = $("#password").val();
var firstname = $("#firstname").val();
var secondname = $("#secondname").val();
var email = $("#email").val();
if (username == '' || password == '' || firstname == '' || secondname == '' || email == '')
{
alert("Please fill all the fields!");
}
else if ((password.length) < 8)
{
alert("Password should have at least 8 characters in length!");
}
else
{
$.post("register.php", {username1: username, password1: password, firstname1: firstname, secondname1: secondname, email1: email},
function(data)
{
if (data == 'You have successfully registered!')
{
$("form-horizontal")[0].reset();
}
alert(data);
});
}
});
});