Hello I want to send a message to a user when I click in a button in my site (more specifically a form submit button), here is my code right now:
contact.js
var fields = {};
document.addEventListener("DOMContentLoaded", function() {
fields.name = document.getElementById("name");
fields.discord = document.getElementById("discord");
fields.email = document.getElementById("email");
fields.message = document.getElementById("message");
});
function isNotEmpty(value) {
if (value == null || typeof value == "undefined") return false;
return value.length > 0;
}
function checkValidation() {
if (!isNotEmpty(fields.name.value)) {
alert("Hey! The field name is required.");
return false;
}
if (!isNotEmpty(fields.discord.value)) {
fields.discord = "Undefined";
}
if (!isNotEmpty(fields.email.value)) {
alert("Hey! The field email is required.");
return false;
}
if (!isNotEmpty(fields.message.value)) {
alert("Hey! The field message is required.");
return false;
}
const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
if (!re.test(String(fields.email.value).toLowerCase())) {
alert("Hey! You need to put a valid e-mail.");
return false;
}
return true;
}
function sendContact() {
if (checkValidation()) {
//SEND THE MESSAGE
alert("You succefully sent a message to our team.");
file.send();
} else {
alert("Error");
}
}
server.js
//OUR SITE
const express = require(“express”);
const app = express();
var fields = {};
app.use(express.static("public"));
app.get("/", (request, response) => {
response.sendFile(__dirname + "/views/index.html");
});
// listen for requests :)
const listener = app.listen(process.env.PORT, () => {
console.log("Your app is listening on port " + listener.address().port);
});
// HIDE HTML
app.get("/plugins/free", (request, response) => {
response.sendFile(__dirname + "/public/plugins/free.html");
});
app.get("/plugins/premium", (request, response) => {
response.sendFile(__dirname + "/public/plugins/premium.html");
});
app.get("/contact", (request, response) => {
response.sendFile(__dirname + "/public/contact.html");
});
//404 ERROR
app.use(function (req, res, next) {
res.status(404).sendFile(__dirname + "/public/errors/404.html");
})
// DISCORD BOT
const Discord = require('discord.js');
const client = new Discord.Client();
const TOKEN = process.env.TOKEN;
module.exports = client;
client.on('ready', () => {
console.info(`Logged in as ${client.user.tag}!`);
});
function sendMessage() {
console.log("Olaaa");
}
exports.send = sendMessage;
client.login(TOKEN);
contact.html
<!-- META -->
<title>PiconoDev - Contact</title>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1"
/>
<meta name="og:title" content="PiconoDev - Contact" />
<meta name="og:site_name" content="PiconoDev" />
<meta name="og:type" content="website" />
<meta
name="description"
content="For a successful Server you require good quality plugins. Get the best Minecraft plugins now!"
/>
<meta
name="keywords"
content="piconodev, picono435, plugins of minecraft, minecraft, plugins to server, servers, plugins, bukkit, minecraft coding, developer, java, spigot"
/>
<meta name="robots" content="index, follow" />
<meta name="author" content="Picono435 (Picono435#2011)" />
<meta name="twitter:title" content="PiconoDev - Contact" />
<meta
name="twitter:description"
content="For a successful Server you require good quality plugins. Get the best Minecraft plugins now!"
/>
<meta
name="twitter:image"
content="https://cdn.glitch.com/e1d426f4-0bad-417f-acf7-313fb14fbf32%2Flogo.png?v=1590575319482"
/>
<meta property="article:author" content="Picono435" />
<meta property="article:DISCORD" content="Picono435#2011" />
<meta name="copyright" content="PiconoDev" />
<link
rel="shortcut icon"
type="image/x-icon"
href="https://cdn.glitch.com/e1d426f4-0bad-417f-acf7-313fb14fbf32%2Flogo.png?v=1590575319482"
/>
</head>
<body>
<!-- HEAD -->
<div id="header-img">
<img
src="https://cdn.glitch.com/e1d426f4-0bad-417f-acf7-313fb14fbf32%2FLogo.png?v=1590576018923"
alt="PiconoDev - Logo"
/>
</div>
<div id="navbar">
<ul>
<div id="translate">
<li><a href="http://crowdin.piconodev.tk/">Help Translating</a></li>
</div>
<li><a href="https://discord.gg/6ecP6K5">Support</a></li>
<li><a href="contact#contact">Contact</a></li>
<div id="dropdown">
<li>
<a id="dropbtn" href="plugins">Plugins</a>
<div id="dropdown-content">
<a href="plugins/free#free">Free</a>
<a href="plugins/premium#paid">Premium</a>
</div>
</li>
</div>
<li><a href="/">Home</a></li>
</ul>
</div>
<header id="header-home">
<img
src="https://cdn.glitch.com/e1d426f4-0bad-417f-acf7-313fb14fbf32%2Flogo-header.png?v=1590590415531"
/>
</header>
<div id="contact">
<form onsubmit="return false">
<br /><br />
<span>Your name</span>
<br />
<input type="text" placeholder="Enter here your name." id="name" />
<br /><br />
<span>Your email</span>
<br />
<input type="email" placeholder="Enter here your e-mail." id="email" />
<br /><br />
<span>Your discord</span>
<br />
<input type="text" placeholder="Enter here your discord." id="discord" />
<br /><br />
<span>Your message</span>
<br />
<textarea id="message" rows="4">Put here your message!</textarea>
<br /><br />
<button onclick="sendContact();">Send contact</button>
</form>
</div>
</body>
</html>
How should I make this?
My project name is piconodev 