In my html in a node application I have a form as follows:
<form action="/getRoute" method="get">
<input type="hidden" name='a' value=<%- array1[0].element1 %>>
<input type="hidden" name='b' value=<%- array2[0].element2 %>>
<button type="submit">Submit</button>
</form>
When I click submit, the getRoute route is executed successfully (confirmed by console.log statement) - however, I cannot access the values of the hidden input fields by req.body - would anyone know how I can access these, or alternatively use another html element to pass data into the route?
Just found out that you these inputs are passed via the URL and can be accessed by req.query.a and req.query.b - it's not ideal to send sensitive data via get requests since the URL can be seen.
Related
I tried to Google search but I did not even know what to search for!
My current problem is: say I have a customer order an item, it will show in his list of orders and he can then edit the order in the future by clicking a button next to the order.
Currently the button submits a hidden form which contains all information needed to identify a particular order and this form is passed into the edit order page through a post request. Although the form is hidden, when page source is viewed the information will still be accessible by the user.
How do I avoid exposing the information to the user? I.e do everything in the backend.
<form method="POST" action="/edit_order">
<input type="hidden" name="owner_email" value=<%=all.owner_email %>>
<input type="hidden" name="owner_email" value=<%=all.transactionId %>>
<input type="hidden" name="start_date" value=<%=moment(all.start_date).format() %>>
<input type="hidden" name="end_date" value=<%=moment(all.end_date).format() %>>
<button type="submit" class="btn btn-secondary">Change this order</input>
</form>
I am currently developing a utility using nodejs, expressjs, neo4j, d3.js for visualization but I m stuck up in a particular use case. i.e. search feature what I am doing is taking the search parameter from the user through a form using post request. and then passing the parameter to another get request where I am executing the query in neo4j using that parameter and that get request is used for taking data for visualization in d3.js. But the problem that I am not able to pass the parameter from one (post) request to another (get)request. please let me know how can I achieve this or is there any other better approach that I can use
form code:
<form method="post" action="/api/xyz">
<h4> Name</h4>
<div class="item">
<input id="name" type="text" name="searchname" required/>
</div>
<div class="btn-block">
<button type="submit" href="/">Search</button>
</div>
</form>
post request:
router.post('/xyz',(req,res,next)=>{
proteinname = req.body.proteinname
console.log(proteinname)
res.render('searchresult')
})
get request:
router.get('/xyz',(req,res,next)=>{
name = proteinname
session
.run('Match(a:Protein {name:{nameParam}})-[r]->(b:Protein) Return a, b,r LIMIT 10',{nameParam:name})
.then(function(neoresult){
res.send(neoresult)
})
I am trying to retrieve multiple values from HTML and make use of it using req.body..
I am able to do this via message: req.body.message
<form id="message-form" class="input-group input-group-lg" style="">
<input type="text" name="message" class="form-control" aria-label="Large" aria-describedby="inputGroup-sizing-sm">
<div class="input-group-prepend">
<button class="btn btn-primary">Send</button>
</div>
</form>
However, I would like to retrieve the values from elements that are not inside the e.g <span id="item" style="font-weight:bold"> </span>
The reason is that when I load the page, it renders these values dynamically (retrieved from database). When I want to do a POST, I would like to make use of these values that have been rendered previously.
Is there a way to do this?
Many thanks.
Forms don't submit data that does not appear inside a form control.
So you can either:
Store the data somewhere in the server (such as in a session) where you can read it back on a subsequent request (watch out for race conditions!) or
Put the data in a form control instead of or as well as in the span. (Possibly using a hidden input).
When I submit my Netlify form the server responds with a 200 status and I get the 'thank you' response page. However, when I check the form submission in the Netlify admin, they are all blank. I've inspected my xhr requests and the data shows in the 'params' section of the browser dev tools.
Disclaimer: I work for Netlify.
When our service stores blank submissions, it has not received any fields from the submission which were defined in the html version of the form with the same name parameter in its definition as the submission.
To start off with, it's useful to know that our service requires a plain html version of your form, with a name parameter as well as the netlify or data-netlify=true parameter; this is what prepares your site to accept form submissions at all, so you had that set up right already; if you didn't, you'd get a 404 when POSTing.
Once you have this in a deploy and we parse it correctly, you'll see the form name in your site settings dashboard on the 'Forms' tab. Note that we ALSO pull all the field names we'll save and show to you in notifications or the dashboard from this file and only this file, so make sure you give each form field all a name as well, in that html file.
If you see the form in your dashboard, yet get a blank submission when you are sure data was POSTed, this probably has one of three causes:
Netlify did not correctly process your field names from the html version of your form. The service will only properly handle the fields which we see in that html version at deploy time.
Netlify does matching by field name at submission time, so make sure that what your site sends to us then matches up between with your deployed html copy of the form. This happens automatically for pure html (no JS) forms since you are POSTing from the file which is the canonical "definition" of your form fields; however for javascript forms you need to take care that the names match up. Put another way, you cannot later add new fields dynamically in javascript and send them (Netlify will accept all fields, as you have seen; but will not store them or notify you about ones that were not processed at deploy time!)
One more quirk that could get in the way: having multiple copies of a form with the same name in your deploy. Only one will be processed, so if you happen to have an errant <form name=test netlify></form> in another html file (or even the same one!) - it could be the one that we process rather than the other form also named test. So, make sure that you only send a single html definition of your form. Note that some frameworks like gatsby render your jsx down into html before deploy, meaning that if you have a plain html file form definition in your deploy - it could be processed instead of the copy gatsby built.
This blog post describes a successful form built in a react app: https://www.netlify.com/blog/2017/07/20/how-to-integrate-netlifys-form-handling-in-a-react-app/
I missed the "name" attribute in input field.
Every input in the form must have a "name" attribute. Something like <input name="email" ...> or <textarea name="message" ...> is what you need.
Don't miss the "name" attribute for both parent and child layers
<form name="contact" method="POST" data-netlify="true">
<input type="text" placeholder="name" class="box" name="name">
<input type="email" placeholder="email" class="box" name="email">
<input type="text" placeholder="project" class="box" name="project">
<textarea name="message" id="" cols="30" rows="10" class="box message" placeholder="message"></textarea>
<div class="field">
<div data-netlify-recaptcha="true"></div>
</div>
<button type="submit" class="btn"> send <i class="fas fa-paper-plane"></i> </button>
</form>
I am trying to implement a simple form that allows me to add photos to venues (there are 30+). I followed a guide here and changed a few things to match the current api. When I use the uploader, I get the JSON response below. Is everything in order? I am getting a 200 response, but I am not seeing the photos added to their respective venue. I have also included my html for the form I am using to upload, please take a look let me know if anything is wrong. Thanks!
JSON Response:
{"meta":{"code":200},"notifications":[{"type":"notificationTray","item":{"unreadCount":0}}],"response":{"photo":{"id":"502ab14fe4b0ed9600d7722d","createdAt":1344975183,"prefix":"https:\/\/irs3.4sqi.net\/img\/general\/","suffix":"\/atVMrQ02CcgHIamCVmTugx4MCX4hIEVv1lLqbo24cnA.jpg","width":700,"height":525}}}
Form HTMl:
<form action="https://api.foursquare.com/v2/photos/add" method="post" enctype="multipart/form-data" v="20120809" >
<p>Venue ID: <input type="text" name="venueId"></p>
<p><input type="file" name="photo"></p>
<input type="hidden" name="oauth_token" value="MY OAUTH TOKEN">
<input type="submit">
</form>