52 lines
2.1 KiB
JavaScript
52 lines
2.1 KiB
JavaScript
|
//
|
||
|
|
// Contact Form Js
|
||
|
|
//
|
||
|
|
|
||
|
|
|
||
|
|
function validateForm() {
|
||
|
|
var name = document.forms["myForm"]["name"].value;
|
||
|
|
var email = document.forms["myForm"]["email"].value;
|
||
|
|
var comments = document.forms["myForm"]["comments"].value;
|
||
|
|
document.getElementById("error-msg").style.opacity = 0;
|
||
|
|
document.getElementById('error-msg').innerHTML = "";
|
||
|
|
if (name == "" || name == null) {
|
||
|
|
document.getElementById('error-msg').innerHTML = "<div class='alert alert-danger error_message'><i data-feather='home' class='icon-sm align-middle me-2'></i> Please enter a name*</div>";
|
||
|
|
fadeIn();
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
if (email == "" || email == null) {
|
||
|
|
document.getElementById('error-msg').innerHTML = "<div class='alert alert-danger error_message'><i data-feather='alert-triangle' class='icon-sm align-middle me-2'></i> Please enter a email*</div>";
|
||
|
|
fadeIn();
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
if (comments == "" || comments == null) {
|
||
|
|
document.getElementById('error-msg').innerHTML = "<div class='alert alert-danger error_message'><i class='mdi mdi-alert'></i> Please enter a comments*</div>";
|
||
|
|
fadeIn();
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
var xhttp = new XMLHttpRequest();
|
||
|
|
xhttp.onreadystatechange = function () {
|
||
|
|
if (this.readyState == 4 && this.status == 200) {
|
||
|
|
document.getElementById("simple-msg").innerHTML = this.responseText;
|
||
|
|
document.forms["myForm"]["name"].value = "";
|
||
|
|
document.forms["myForm"]["email"].value = "";
|
||
|
|
document.forms["myForm"]["comments"].value = "";
|
||
|
|
}
|
||
|
|
};
|
||
|
|
xhttp.open("POST", "php/contact.php", true);
|
||
|
|
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
|
||
|
|
xhttp.send("name=" + name + "&email=" + email + "&comments=" + comments);
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
function fadeIn() {
|
||
|
|
var fade = document.getElementById("error-msg");
|
||
|
|
var opacity = 0;
|
||
|
|
var intervalID = setInterval(function () {
|
||
|
|
if (opacity < 1) {
|
||
|
|
opacity = opacity + 0.5
|
||
|
|
fade.style.opacity = opacity;
|
||
|
|
} else {
|
||
|
|
clearInterval(intervalID);
|
||
|
|
}
|
||
|
|
}, 200);
|
||
|
|
}
|