Trying to send user feedback to email using an embedded contact form; without using a mailto:
I have a mostly static web page served up by nginx containing html/browser-javascript.
The strategy is very similar to this:
http://www.phpeasystep.com/phptu/8.html
My static page has a form section:
<form action="sendmail.js" method="post" id="contactForm">
<div class="sep">
<label for="name" class="txt">Name:</label>
<input type="text" name="name" value="" id="name">
</div>
<div class="sep">
<label for="email" class="txt">Email:</label>
<input type="text" name="email" value="" id="email">
</div>
<div class="sep">
<label for="tele" class="txt">Telephone:</label>
<input type="text" name="tele" value="" id="tele">
</div>
<div class="sep special">
<label for="last" class="txt">Don't fill this in:</label>
<input type="text" name="last" value="" id="last">
</div>
<div class="sep">
<label for="message" class="txt">Message:</label>
<textarea rows="5" name="message" id="message"></textarea>
</div>
<div class="buttonAlign submitbutton">
<button type="submit" class="button mediumButton" id="submit">Send Message</button>
</div>
</form>
I want the form elements passed to a server side node.js script, sendmail.js, and have that script compose an email with the form elements then dispatch.
I'm rather new to node.js and nginx and I'm not sure what I'm missing; but, its not working, the script is not running at all.
I've added nothing special to the nginx default.conf file.
The node.js script is in my base directory and if I rename it, I get a file not found error. So, I know nginx is looking for it. The first line of the script file has the node.js she-bang and its chmod'ed to executable.
Appreciate any help.
I get the following message in access.log
==> access.log <==
"POST /sendmail.js HTTP/1.1" 405 574 "https://xyzzy.net/index.html" "Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; WOW64; Trident/6.0)" "-"
I'm not expecting a response to appear in the web page. I just want to execute the sendmail.js script and send an email containing the form data.
Here's a 'dummy' script which attempts to create/write a 'breadcrumbs' file in /tmp
#!/usr/local/bin/node
var fs = require('fs');
fs.writeFile("/tmp/test", "Hey there!", function(err) {
if(err) {
console.log(err);
} else {
console.log("The file was saved!");
}
});
Related
I have this weird issue and it seems that I can't resolve it.
Whenever I submit my form, it goes to a "double route".
This is my html form.
<form action="eveniment/<%=eveniment._id%>" method="POST" id="modificaeveniment">
<input type="text" placeholder="titlu eveniment" name="titlu" value="<%= eveniment.name %>">
<button class="btn btn-info">Submit</button>
</form>
This is the route:
app.post("/eveniment/:id", function(req, res){ res.send("post route"); }
And I always get the error:
Cannot POST /eveniment/5f1740204a5a2206cc02b5af/eveniment/5f1740204a5a2206cc02b5af
It looks like somehow it doubles the route.
Just add a / at action="eveniment/<%=eveniment._id%>"
<form action="/eveniment/<%=eveniment._id%>" method="POST" id="modificaeveniment">
<input type="text" placeholder="titlu eveniment" name="titlu" value="<%= eveniment.name %>">
<button class="btn btn-info">Submit</button>
</form>```
I am using ejs template, expressjs, and mongoose. not able to update existed data through form while click on edit button and as well not able to delete it . I want to delete when user click a button as well when user click on edit button it show form and allow him to edit. I already wrote get route , it is working fine.
**Update route:**
router.put('/success123' , function (req, res) {
// const id = req.params.id;
Campaign.findById(id)
.then(campaign => {
campaign.Title = req.body.title;
campaign.Description = req.body.Description;
campaign.save().then(updatePost => {
res.render('success123');
});
});
});
**Delete route**
router.delete ('/delete/:id' , function (req, res){
Campaign.findByIdAndDelete(req.params.id)
.then(deletedPost => {
res.render('success');
});
});
I am getting error and cant figure it out . Event it is not showing any error message in my console. both deleting and updating parts not working and i am able to success fully get route while user click on edit campaign button.
My ejs template for update : THIS IS MY EJS TEMPALTE WHERE I AM SENDING UPDATE INFORMATION THROUGH FORM
<div class="row p-4">
<div class="col-md-7">
<form action="/success123" method="post" enctype="multipart/form-data">
<div class="form-group">
<label for="title">Title</label>
<input type="text" value="<%=camplist.Title%>" class="form-control" name="title" id="title" placeholder="Enter The Title">
</div>
<div class="form-group">
<label for="description">Description</label>
<textarea value="" name="description" id="description" class="form-control" placeholder="Enter your content here" rows="10"><%=camplist.Description%></textarea>
</div>
<div>
<input class="form-control" name="rules" type="hidden" placeholder="Enter The Title">
<textarea name="rules" id="editor"></textarea>
</textarea>
</div>
<div class="form-group">
<label for="file">Upload Your Banner Image </label>
<input type="file" class="form-control" id="file" name="uploadedFile" accept="image/jpeg, image/jpg, image/png, image/bmp">
</div>
<button class="btn btn-outline-success btn-lg" type="submit">Update Post</button>
</form>
I am getting error and cant figure it out . Event it is not showing any error message in my console. both deleting and updating parts not working and i am able to success fully get route while user click on edit campaign button.
I've deployed my node js app to Heroku, and everything seems to work perfect except static image files.
I've tested locally with
heroku local web
and the images are working correctly, but not when I check in heroku.
I'm working with node.js, express and handlebars for templates. This is the project structure.
Images are located in public/imagenes/
and my views in views/
And this is the code of the login.hbs file that it's not showing the images.
<div class="login-page">
<div class="form">
<form class="register-form" name="register" method="POST" action="/register_success">
<input type="text" name="email" placeholder="email" required/>
<input type="password" name="password" placeholder="password" required/>
<input type="text" name="nombre" placeholder="nombre"/>
<input type="submit" value="Crear cuenta" name="register_success"></input>
<p class="message">Ya registrado? Entrar</p>
<img src="../public/imagenes/YupiLogo.png" alt="Logo Yupi" width="15%" id="cabecera"/>
</form>
<form class="login-form" name="login" method="POST" action="/login">
<input type="text" name="email" placeholder="email" required/>
<input type="password" name="password" placeholder="password" required/>
<input type="submit" value="Login" name="login"/>
<p class="message">No registrado? Crea una cuenta</p>
<img src="imagenes/YupiLogo.png" alt="Logo Yupi" width="15%" id="cabecera"/>
</form>
</div>
</div>
<script>
$(document).ready(function(){
$('.message a').click(function(){
$('form').animate({height: "toggle", opacity: "toggle"}, "slow");
});
});
</script>
You can check the app in heroku at heroku node app
Attached network request for images.
I had look at Heroku app, it throws error of 404 for images as it is not possible for it to find path of images.
To make application able to find path, please add following statement into your main .js file
app.use(express.static('public/imagenes'));
and provide image name into src as following,
<img src="YupiLogo.png" alt="Logo Yupi" width="15%" id="cabecera"/>
I am trying to build an app that lets users find other users with a specific combination of skills. I ask the users to select which skills they are looking for via checkboxes but I'm not sure how to request for the status of that checkbox in my function.
My function currently is:
UserInfo.find()
.where('skill1').equals('')
.where('skill2').equals('')
.where('skill3').equals('')
.limit(10)
.then(function(doc) {
res.render('index', {items: doc});
});
It works properly if I set the equals('') to true or false but I'm not sure how to set it dynamically. My HTML code for the checkboxes is:
<form action="/getskills" method="get">
<div class="input">
<label for="skill1">Skill1</label>
<input type="checkbox" id="skill1" name="skill1" value="skill1"/>
</div>
<div class="input">
<label for="skill2">Skill2</label>
<input type="checkbox" id="skill2" name="skill2" value="skill2"/>
</div>
<div class="input">
<label for="skill3">Skill3</label>
<input type="checkbox" id="skill3" name="skill3" value="skill3"/>
</div>
FIND SKILL
</form>
How can I create and integrate a function to check the value of the checkbox and set the value of the required skill to either true or false?
Thanks in advance for your help.
The problem is that you are using an <a> element to perform the request to the server instead of <input type="submit">. Without a submit button, the elements on your form will not be submitted with the request. Modify your html to this
<form action="/getskills" method="get">
<div class="input">
<label for="skill1">Skill1</label>
<input type="checkbox" id="skill1" name="skill1" value="skill1" />
</div>
<div class="input">
<label for="skill2">Skill2</label>
<input type="checkbox" id="skill2" name="skill2" value="skill2" />
</div>
<div class="input">
<label for="skill3">Skill3</label>
<input type="checkbox" id="skill3" name="skill3" value="skill3" />
</div>
<input type="submit" value="FIND SKILL" />
</form>
then in your Node.js code (I assume you are using express), you can get the checkbox values as query parameters as follows:
//I'm assuming the req parameter is passed in to the express get() method
UserInfo.find()
.where('skill1').equals(req.query.skill1)
.where('skill2').equals(req.query.skill2)
.where('skill3').equals(req.query.skill3)
.limit(10)
.then(function(doc) {
res.render('index', {items: doc});
});
How do I trigger a get request from a bootstrap button? I have the following code:
<form class="navbar-form navbar-right" role="form">
<div class="form-group">
<input type="text" placeholder="Email" class="form-control">
</div>
<div class="form-group">
<input type="password" placeholder="Password" class="form-control">
</div>
<button type="submit" class="btn btn-success">Sign in</button>
<button type="submit" class="btn btn-warning" value="/signup" id="submit">Sign up</button>
</form>
and would like this button to perform a get request with the following value "signup"
I am using a MEAN stack and the routes are set up so when the app is accessed with the get value /signup it goes to the signup page. But I am not able to get the bootstrap 3 button to post a get a request.
On your form you will need the following two attributes:
Action = "{URL TO SEND THE FORM TO}"
Method = "{GET or POST}"
For a signup with a username and password you should really think about doing a POST request so the form element should look like (for a POST request):
<form action="/signup" method="POST" class="navbar-form navbar-right" role="form">
or for a get request:
<form action="/signup" method="GET" class="navbar-form navbar-right" role="form">