Form submit displays javascript coe instead of executing it - javascript

I'm trying to create an HTML form that will send an email using the information inputed. For now however, I just hard coded the information into the script itself, so the field inputs don't matter. However, whenever I press the Submit button, is simply displays the Javascript to the screen instead of executing it. The script is in the same directory as the HTML.
I tested it by running it directly from the Ubuntu terminal and successfully received an email from it.
I'm running this on Ubuntu 16.04, Node v6.14.3. The HTMl uses Bootstrap 4, and the email process is with Nodemailer. Thank you very much for your time.
-Joel
var nodemailer = require('nodemailer');
var transporter = nodemailer.createTransport({
service: 'gmail',
auth: {
user: 'redacted',
pass: 'redacted'
}
});
const mailOptions = {
from: 'redacted',
to: 'redacted',
subject: 'hey',
text : 'text',
html: '<p>Your html here</p>',
attachments:[
{
filename: 'anglerite.png',
path: '/home/joel/Desktop/Anglerite/img/anglerite.png'
}
]
};
transporter.sendMail(mailOptions, function (err, info) {
if(err)
console.log(err)
else
console.log(info);
});
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags always come first -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.css">
<link rel="stylesheet" href="css/bootstrap-social.css">
<link rel="stylesheet" href="css/styles.css">
<title>Redacted</title>
</head>
<form" class = "col-sm-6" action = "app4.js" method = "POST" >
<div class = "row form-row form-group">
<div class = "col-sm-5">
<input type = "text" class = "form-control-plaintext full-width" id = "name" placeholder = "Your name here">
</div>
<div class = "col-sm-2">
</div>
<div class = "col-sm-5 widen-slightly">
<input type = "text" class = "form-control-plaintext full-width" id = "staticEmail" placeholder = "email#example.com">
</div>
</div>
<div class = "row form-row form-group">
<div class = "col-sm-12 widen-slightly">
<input type = "text" class = "form-control-plaintext full-width" id = "phone" placeholder = "Phone number with area code">
</div>
</div>
<div class = "row form-row form-group">
<div class = "col-sm-12 widen-slightly">
<input type = "text" class = "form-control-plaintext full-width" id = "subject" placeholder = "Subject">
</div>
</div>
<div class = "row form-row form-group">
<div class = "col-sm-12 widen-slightly">
<textarea rows = "6" class = "form-control-plaintext full-width" id = "Description" placeholder = "Description"></textarea>
</div>
</div>
<div class = "row form-row form-group">
<label class = "col-sm-3 col-form-label" >Any Photos</label>
<div class = "col-sm-7">
<input type = "file" class = "form-control-file full-width" id = "">
</div>
<div class = "cl-sm-2">
<button type="submit" class="btn btn-default" id = "submit">Submit</button>
</div>
</div>
</form>
EDIT: Chris Happy's answer proposed moving the Javascript from an external file referenced only by the action property, to references to a in the same page.

I suspect you are redirecting to your script file rather than running the code on submit.
In other words, your form looks something like this:
<form action"script-file.js" method="GET">
<input type="text" value="Some text">
<input type="submit" value="Save">
</form>
However, that will redirect to your script file and it will display on the browser as plain text.
Instead, display your form and code like this:
<form id="myForm" action="/" method="GET">
<input type="text" value="Some text">
<input type="submit" value="Save">
</form>
<!-- Use: <script src="myscripts.js"></script> or -->
<script>
const myForm = document.getElementById('myForm');
myForm.addEventListener("click", () => {
var nodemailer = require('nodemailer');
var transporter = nodemailer.createTransport({
service: 'gmail',
auth: {
user: 'redacted',
pass: 'redacted'
}
});
const mailOptions = {
from: 'redacted',
to: 'redacted',
subject: 'hey',
text: 'text',
html: '<p>Your html here</p>',
attachments: [{
filename: 'anglerite.png',
path: '/home/joel/Desktop/Anglerite/img/anglerite.png'
}]
};
transporter.sendMail(mailOptions, function(err, info) {
if (err)
console.log(err)
else
console.log(info);
});
});
</script>

Related

form not being submitted even after full validation

Ideal Case:
if form valid send data to the servlet.
if not show the respective errors
What actually is happening: when i submit a form with wrong credentials the form gets stuck and the data does not go to the servlet which is what we want but when I enter the right credentials even then the form is not being submitted to the servlet. Here is my JavaScript code:
const form = document.getElementById('register-form');
const fname = document.getElementById('fname');
const lname = document.getElementById('lname');
const email = document.getElementById('email');
const password = document.getElementById('password');
const sendData = (fnameVal, sRate, count) => {
if (sRate === count) {
swal("Congratulations " + fnameVal + " !", "Account Created Successfully", "success");
form.submit();
}
}
const successMsg = (fnameVal) => {
let formG = document.getElementsByClassName('form-group');
var count = formG.length - 1;
for (var i = 0; i < formG.length; i++) {
if (formG[i].className === "form-group success") {
var sRate = 0 + i;
sendData(fnameVal, sRate, count);
} else {
return false;
}
}
}
const isEmail = (emailVal) => {
var re = /^\S+#\S+\.\S+$/;
if (!re.test(emailVal)) return false;
var atSymbol = emailVal.indexOf("#");
if (atSymbol < 1) return false;
var dot = emailVal.indexOf('.');
if (dot === emailVal.length - 1) return false;
return true;
}
const isPassword = (passwordVal) => {
var re = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[#$!%*?&])[A-Za-z\d#$!%*?&]{8,}$/;
if (!re.test(passwordVal)) {
return false;
}
return true;
}
const validate = () => {
const fnameVal = fname.value.trim();
const lnameVal = lname.value.trim();
const emailVal = email.value.trim();
const passwordVal = password.value.trim();
// validate first-name
if (fnameVal.length <= 2) {
setErrorMsg(fname, 'first-name requires min 3 char');
} else {
setSuccessMsg(fname);
}
// check last-name
if (lnameVal.length <= 2) {
setErrorMsg(lname, 'last-name requires min 3 char');
} else {
setSuccessMsg(lname);
}
// check email
if (!isEmail(emailVal)) {
setErrorMsg(email, 'not valide email');
} else {
setSuccessMsg(email);
}
// check password
if (!isPassword(passwordVal)) {
setErrorMsg(password, "min 8 char, at least 1 uppercase and lowercase letter, one number and special character");
} else {
setSuccessMsg(password);
}
successMsg(fnameVal);
}
function setErrorMsg(input, errormsgs) {
const formGroup = input.parentElement;
const small = formGroup.querySelector('small');
formGroup.className = "form-group error";
small.innerText = errormsgs;
}
function setSuccessMsg(input) {
const formGroup = input.parentElement;
formGroup.className = "form-group success";
}
var s = document.getElementById("status").value;
if (s == "success") {
swal("Congratulations", "Account Created Successfully", "success");
}
Here is my HTML code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QuizzBuzz Sign-Up Portal</title>
<link rel="stylesheet" href="./css/registration-style.css">
<!--font-->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
</head>
<body>
<input type="hidden" name="hiddenalert" id = "status" value = "<%= request.getAttribute("hiddenalert") %>">
<div class="main">
<section class="signup">
<div class="container">
<div class="signup-content">
<div class="signup-image">
<figure>
<img src="./images/signup-image.jpg" alt="singup-image">
</figure>
</div>
<div class="signup-form">
<h2 class="title">Create an Account</h2>
<form method="post" action="Register" class="register-form" id="register-form">
<div class="form-group">
<select id="userType" class="userType" name="userType" required="required">
<option value="student">Student</option>
<option value="teacher">Teacher</option>
<option value="admin">Admin</option>
</select>
</div>
<div class="form-group">
<input type="text" name="firstname" id="fname" placeholder="Enter your first-name" autocomplete="off" required="required">
<i class="fa-solid fa-circle-check"></i>
<i class="fa-solid fa-exclamation-circle"></i>
<small>Error!</small>
</div>
<div class="form-group">
<input type="text" name="lastname" id="lname" placeholder="Enter your last-name" autocomplete="off" required="required">
<i class="fa-solid fa-circle-check"></i>
<i class="fa-solid fa-exclamation-circle"></i>
<small>Error!</small>
</div>
<div class="form-group">
<input type="email" name="email" id="email" placeholder="Enter your Email ID" autocomplete="off" required="required">
<i class="fa-solid fa-circle-check"></i>
<i class="fa-solid fa-exclamation-circle"></i>
<small>Error!</small>
</div>
<div class="form-group">
<input type="password" name="password" id="password" placeholder="Enter your password" autocomplete="off" required="required">
<i class="fa-solid fa-circle-check"></i>
<i class="fa-solid fa-exclamation-circle"></i>
<small>Error!</small>
</div>
<input type="submit" value="Submit" onclick = "event.preventDefault(); validate()" class="button">
</form>
</div>
</div>
</div>
</section>
</div>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="./js/member-registration.js"></script>
</body>
</html>
I think it has something to do with the event.preventDefault() function but i dont know exactly how to get around the problem and solve it.And the sweet alerts also do not work
I highly recommend you to validate users and passwords formats also in servlets(or server side).
This because people could just erase or stop all javascript validation and directly send their data.
Validating in client side is not wrong but is not secure at all.
Now, answering your request, if the credentials are in a correct format you are just submitting the form tag like this.
<form method="post" action="Register" class="register-form" id="register-form">
The "action" attribute work is redirecting the form content to the url you write in it.
So action="Register" is not correct(If you were reaching a servlet, it have to be a valid path, like: '/Register').
In it's place, you have to write a relative path that is current being listened by a servlet or a jsp, like this:
action="register.jsp" or action="/register"
This way, when you submit your form, it is gonna redirect you and your form content to the path you wrote.
Another way is send data trough ajax(You can research it), the form data is sent without reloading and your javascript recives a response from the server.
Let me know if i helped.

how to insert array of objects in mongodb using express js

i want to insert my form data as an array of multiple objects.
how can i acheive this ..?
in below code only one object is inserted but i want to insert multiple objects that was described in mongoose schema.
i research a lot to do this but cant get success. please help me to acheive this.
i already acheive this in php but unable to do this in express.
[here is the code][1]
My Form
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.2.0/css/bootstrap.min.css" integrity="sha512-XWTTruHZEYJsxV3W/lSXG1n3Q39YIWOstqvmFsdNEEQfHoZ6vm6E9GK2OrF6DSJSpIbRbi+Nn0WDPID9O7xB2Q==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.2.0/js/bootstrap.bundle.min.js" integrity="sha512-9GacT4119eY3AcosfWtHMsT5JyZudrexyEVzTBWV3viP/YfB9e2pEy3N7WXL3SV6ASXpTU0vzzSxsbfsuUH4sQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.2.0/js/bootstrap.min.js" integrity="sha512-8Y8eGK92dzouwpROIppwr+0kPauu0qqtnzZZNEF8Pat5tuRNJxJXCkbQfJ0HlUG3y1HB3z18CSKmUo7i2zcPpg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css" integrity="sha512-1sCRPdkRXhBV2PBLUdRb4tMg1w2YPf37qatUFeS7zlBy7jJI8Lf4VHwWfZZfpXtYSLy85pkm9GaYVYMfw5BC1A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<body>
<script>
function remove_more(id) {
alertify.confirm('One Point ', 'Are you sure want to delete !', function () {
$('#box' + id).fadeOut(600, function () {
$('#box' + id).remove();
});
}, function () {
alertify.error('Cancel')
});
}
</script>
<div class="container my-5">
<form action="/add" method="post">
<input type="text" name="name" id="">
<input type="email" name="email" id="">
<div id="attributeBox" class="mb-3">
<div class="form-group row">
<div class="col-sm-5">
<label for="price" class="col-sm-3 control-label col-form-label">Price</label>
<input type="text" class="form-control" name="price[]" id="price">
</div>
<div class="col-sm-5">
<label for="qty" class="col-sm-3 control-label col-form-label">Qty</label>
<input type="text" class="form-control" name="qty[]" id="qty">
</div>
<div class="col-sm-2 mt-4 d-flex-align-item-center ">
<button type="button" id="Addattribute" class="btn btn-warning btn-sm"><i
class="fa fa-plus"></i></button>
</div>
</div>
</div>
<input type="hidden" id="numattribute" value="1">
<input type="submit" value="Submit">
</form>
</div>
<script>
$('#Addattribute').click(function (e) {
e.preventDefault();
var numattribute = jQuery('#numattribute').val();
numattribute++;
jQuery('#numattribute').val(numattribute);
var html1 = '<div id="box' + numattribute + '"><div class="form-group row"><div class="col-sm-5"><label for="price" class="col-sm-3 control-label col-form-label">Price</label><input type="text" class="form-control" name="price[]" id="price"></div><div class="col-sm-5"><label for="qty" class="col-sm-3 control-label col-form-label">Qty</label><input type="text" class="form-control" name="qty[]" id="qty"></div><div class="col-sm-2 mt-4 d-flex-align-item-center "><button type="button" id="Addattribute" class="btn btn-danger btn-sm float-right" onclick="remove_more(' + numattribute + ')"><i class="fa fa-trash"></i></button></div></div></div>'
jQuery('#attributeBox').append(html1);
});
</script>
</body>
</html>
mongoose schema
const mongoose = require("mongoose");
const { Schema } = mongoose;
const usersSchema = new Schema({
name: {
type: String,
required: [true, "Name is Required"],
},
email: {
type: String,
required: [true, "Email is Required"],
},
attributes: [
{
qty: { type: String, default: 1 },
price: { type: String, default: 1 },
},
],
created: {
type: Date,
required: true,
default: Date.now,
},
});
const user = mongoose.model("user", usersSchema);
user.createIndexes();
module.exports = user;
Add User API post
router.post("/add", urlencodedParser, async (req, res, next) => {
// An array of keys
var keys = req.body.qty;
// An array of values
var values = req.body.price;
// Map created
var map = new Map();
// Using loop to insert key
// value in map
for (var i = 0; i < keys.length; i++) {
map.set(keys[i], values[i]);
}
// Printing
for (var key of map.keys()) {
console.log(key + " => " + map.get(key));
}
const user = new User({
name: req.body.name,
email: req.body.email,
attributes: [
{
qty: key,
price: map.get(key),
},
],
});
console.log(user);
await user.save((err) => {
if (err) {
res.json({ message: err.message, type: "error" });
} else {
res.redirect("/");
}
});
});
my form has multiple fields

How to get the url of your backend api to use it in jquery in html

I am writing a login form and I need to make an authentication for the username and password.
The form is written in dreamweaver html code. And the database is local in visual studio .net core code. I am still trying to figure out a way to use $post and $get methods, but I even can't write the url correctly. I am using swagger to host my api.
Here is my visual studio controller code :
using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc;
using authentication.Models;
using authentication.Repository;
using Microsoft.AspNetCore.Http;
namespace Taskb.Controllers
{
[Route("api/[controller]")]
[ApiController]
public class UserController : ControllerBase
{
private UsersRepository users = new UsersRepository();
private int count = 0;
[HttpGet]
public ActionResult<IEnumerable<user>> GetAllUser()
{
return users.GetAllUsers();
}
[HttpPost]
public ActionResult<user> CreateUser( user newUser)
{
foreach (user item in users.GetAllUsers())
{
if (newUser.username == item.username && newUser.password == item.password)
{
count++;
}
}
if (count == 0)
{
return StatusCode(StatusCodes.Status500InternalServerError, "Username or password incorrect");
}
return Ok("Authentication Successfull");
}
}
}
And here is my html code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Roy Daher</title>
<link href="styles/style.css" rel="stylesheet" type="text/css">
<meta name="viewport" content="width=device-width, initial scale 1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"
type="text/javascript"></script>
<!--include jQuery Validation Plugin-->
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.12.0/jquery.validate.min.js"
type="text/javascript"></script>
</head>
<body bgcolor="#F1F1F1" class="body">
<div class="cont" >
<div class="top"></div>
<div class="bottom"></div>
<div class="center">
<form id="form" method="post">
<!--<div class="image">
<img src="images/28-287073_elonlol-discord-emoji-elon-musk-laughing-deer-hd.png" width="282" height="290" alt="Picture" class="elon">
</div>-->
<div class="container">
<label for="user"><b>Username</b></label>
<input type="text" placeholder="Enter Username" name="user" required id="userinput">
<label for="pass"><b>Password</b></label>
<input type="password" placeholder="Enter Password" name="pass" required id="passinput">
<button id="loginButton" type="button">Login</button>
<label for="remember">Remember me</label>
<input type="checkbox" checked="checked" name="remember">
</div>
<div class="container" style="background-color:#F1F1F1">
<span class="forgot">Forgot <a href="pages/PassRecovery.html" target="_blank" >password?</a></span>
</div>
</form>
</div>
</div>
</body>
<script>
$(document).ready(function(){
$("button").click(function(){
var inputVal = document.getElementById("userinput").value;
var passVal = document.getElementById("passinput").value;
var obj ={
username:inputVal,
password:passVal
};
console.log(obj);
$.post("https://44332/api/User",
{
},
});
});
});
</script>
</html>
Thank you in advance for your help.
Your post method should use [FromBody] user newUser as the input parameter like below:
[HttpPost]
public ActionResult<user> CreateUser([FromBody] user newUser)
{
List<user> users = new List<user> {
new user{ username="a",password="a"},
new user{ username="b",password="b"},
new user{ username="c",password="c"}
};
foreach (user item in users)
{
if (newUser.username == item.username && newUser.password == item.password)
{
count++;
}
}
if (count == 0)
{
return StatusCode(StatusCodes.Status500InternalServerError, "Username or password incorrect");
}
return Ok("Authentication Successfull");
}
And your ajax request should send like this:
<button id="loginButton">login</button>
<script>
$("#loginButton").click(function(){
var obj ={
username:"a",
password:"a"
};
$.ajax({
url: "https://localhost:44317/api/user",
type: 'post',
contentType: 'application/json',
data: JSON.stringify(obj),
success: function(data) {
alert(data);
}
})
});
</script>

Not submit data in mongodb database

Here i tried to store form data in my mongodb database(mongodb compass).
but after submit when i check than there are nothing in my database.
when i press sign up button than it's show me just curly brackets.
App.js file(main file)
const express = require("express");
const app = express();
const port = 8081;
require('./db/conn');
const path = require("path");
const hbs = require("hbs");
const register = require("./models/register");
const static_path = path.join(__dirname,"../public");
const template_path = path.join(__dirname,"../templates/views");
const partials_path = path.join(__dirname,"../templates/partials");
app.set("views",template_path);
app.set("view engine","hbs");
hbs.registerPartials(partials_path);
app.use(express.json());
app.use(express.urlencoded({extended:false}));
app.get("/",(req,res)=>{
res.render("signup");
})
app.get("/signup",(req,res)=>{
res.render("index");
})
app.get("/register",(req,res)=>{
res.render("register");
})
app.post("/register",async(req,res)=>{
try{
const password = req.body.password;
const cpassword = req.body.cpassword;
if(password===cpassword){
const registerEmployee = new Register({
firstname : req.body.firstname,
lastname : req.body.lastname,
email : req.body.email,
phone : req.body.phone,
age : req.body.age,
password: req.body.password,
})
const registered = await registerEmployee.save();
console.log(registered);
}
else{
res.send("password not matched");
}
res.send(registered);
}catch(error){
res.status(404).send(error)
}
})
app.listen(port,()=>{
console.log("succesfully port");
})
register.js file(here i define mongoose.schema file)
const mongoose = require("mongoose");
const employeeSchema = mongoose.Schema({
firstname :{
type:String,
required:true,
},
lastname:{
type:String,
required:true,
},
email:{
type:String,
required:true,
unique:true,
},
phone:{
type:Number,
required:true,
unique:true,
},
age:{
type:Number,
required:true,
},
password:{
type:String,
required:true,
},
})
const Register = new mongoose.model("register",employeeSchema);
module.exports = Register;
signup.hbs file(html form)
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap#4.5.3/dist/css/bootstrap.min.css"
integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="css/signin.css">
<title>Create New Account</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous">
</script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap#4.5.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous">
</script>
<div class="signin-form">
<form action="/register" method="POST">
<div class="form-header">
<h2>Sign Up</h2>
<h2>Fill out this form and start chatting with your friends.</h2><br>
</div>
<div class="form-group">
<br>
<lable>firstname</lable>
<input type="text" class="form-control" name="firstname" placeholder="Username" />
</div>
<div class="form-group">
<br>
<lable>lastname</lable>
<input type="text" class="form-control" name="lastname" placeholder="Username" />
</div>
<div class="form-group">
<br>
<lable>email Address</lable>
<input type="text" class="form-control" name="email" placeholder="someone#site.com" />
</div>
<div class="form-group">
<br>
<lable>phone Number</lable>
<input type="text" class="form-control" name="phone" placeholder="contact number" />
</div>
<div class="form-group">
<br>
<lable>Age</lable>
<input type="number" class="form-control" name="age" placeholder="age" />
</div>
<div class="form-group">
<label> Password </label>
<input type="text" class="form-control" name="password" placeholder="password" />
</div>
<div class="form-group">
<label>Confirm Password </label>
<input type="text" class="form-control" name="cpassword" placeholder="confirm password" />
</div>
<input type="checkbox" class="checkbox-inline" /> <label>i accept terms and condition</label>
<div class="form-group">
<button class="btn btn-primary btn-block btn-lg " name="sign_up">Sign_Up</button>
</div>
</form>
<div class="text-center small" style="color:#67428B;"> Already have an Account ?Login </div>
</div>
</body>
</html>
try to put new before mongoose.Schema :
const employeeSchema = new mongoose.Schema
after so much time i solved error successfully, so i think i want to write here
here you can see in app file 7th line
const register = require("./models/register");
and when i enter new data then i use Register instead of register so there are an error.
const registerEmployee = new Register

Nodemailer script does not execute when called from the website

I'm trying to use Nodemailer to send emails by clicking submit on a web form. The test strings of the embedded script are being printed, but after that the script fails with this message in the console:
ReferenceError: require is not defined
What's interesting is that I receive emails from this script when I run it directly from the terminal, but when I try to trigger it from my web form, I get this error.
Almost everywhere I've looked people present a script such as the one directly below as being the only thing needed to send emails using Nodemailer. Neither the Nodemailer website nor W3Schools make reference to anything else. What am I missing?
Thank you for your time,
-Joel
<script>
const myForm = document.getElementById('myForm');
console.log("Testing!");
myForm.addEventListener("click", () => {
var nodemailer = require('nodemailer');
var transporter = nodemailer.createTransport({
service: 'gmail',
auth: {
user: 'angleritemailer#gmail.com',
pass: 'hammertime80'
}
});
const mailOptions = {
from: 'angleritemailer#gmail.com',
to: 'joelnashjobs#yahoo.com',
subject: 'hey',
text : 'text',
html: '<p>Your html here</p>'
}
transporter.sendMail(mailOptions, function(err, info) {
if (err)
console.log(err)
else
console.log(info);
});
});
</script>
<form" class = "col-sm-6" action = "/" method = "POST" id = "myForm">
<div class = "row form-row form-group">
<div class = "col-sm-5">
<input type = "text" class = "form-control-plaintext full-width" id = "name" placeholder = "Your name here">
</div>
<div class = "col-sm-2">
</div>
<div class = "col-sm-5 widen-slightly">
<input type = "text" class = "form-control-plaintext full-width" id = "staticEmail" placeholder = "email#example.com">
</div>
</div>
<div class = "row form-row form-group">
<div class = "col-sm-12 widen-slightly">
<input type = "text" class = "form-control-plaintext full-width" id = "phone" placeholder = "Phone number with area code">
</div>
</div>
<div class = "row form-row form-group">
<div class = "col-sm-12 widen-slightly">
<input type = "text" class = "form-control-plaintext full-width" id = "subject" placeholder = "Subject">
</div>
</div>
<div class = "row form-row form-group">
<div class = "col-sm-12 widen-slightly">
<textarea rows = "6" class = "form-control-plaintext full-width" id = "Description" placeholder = "Description"></textarea>
</div>
</div>
<div class = "row form-row form-group">
<label class = "col-sm-3 col-form-label" >Any Photos</label>
<div class = "col-sm-7">
<input type = "file" class = "form-control-file full-width" id = "">
</div>
<div class = "cl-sm-2">
<button type="submit" class="btn btn-default" id = "submit">Submit</button>
</div>
</div>
</form>

Categories