I have made a basic example with a form and some PHP/JavaScript code. I'm validating the form using JavaScript and using PHP simply to update MySQL table.
function checkForm(){
var x = document.forms['form1']['first'].value;
if(x=='' || x==null){
alert('please finish all required fields');
return false;
}
var y = document.forms['form1']['last'].value;
if(y=='' || y==null){
alert('please finish all required fields');
return false;
}
var z = document.forms['form1']['email'].value;
if(z=='' || z==null){
alert('please finish all required fields');
return false;
}
var a = document.forms['form1']['phone'].value;
if(a=='' || a==null){
alert('please finish all required fields');
return false;
}
}
</script>
</head>
<body>
<?php
$connect = mysqli_connect('localhost','colin','-koolio-','knoxprograms');
if(mysqli_connect_errno()){
echo "Error " . mysqli_connect_error();
}
$first = mysqli_real_escape_string($connect, $_POST['first']);
$last = mysqli_real_escape_string($connect, $_POST['last']);
$email = mysqli_real_escape_string($connect, $_POST['email']);
$phone = mysqli_real_escape_string($connect, $_POST['phone']);
$sql = "insert into users(firstName, lastName, email, phone) VALUES('$first','$last','$email','$phone');";
mysqli_multi_query($connect, $sql);
?>
<form name="form1" method="post" action="fuckwithpage.php" onsubmit="return checkForm()">
First name: <input type="text" name="first"><br>
Last Name: <input type="text" name="last"><br>
email: <input type="text" name="email"><br>
phone: <input type="text" name="phone"><br>
<input type="submit" value="send">
</form>
The JavaScript validation that occurs when the form is submitted(submit button is clicked) prevents my table from being updated if my validation function for the form returns false. However if the page is reloaded or when i load the page, an empty row is added to my table. can anyone assist me with this.