CODEWITHSUNDEEP
javascriptnode.jsexpress
BS100
BS100

Reputation: 873

Express-How do I pass a value from a form and receive it from another html and access the value in js?

What I try to achieve in Express is quite complicated.

I wanna get a data from the form of 'inputdata.html'.(whose ROUTE is '/inputdata)

And this data will be passed to 'info.html'. (whose ROUTE is '/info')

Then the script file for 'info.html' will read the data which 'info.html' gets from the FROM of 'inputdata.html'.

Then, put this value into a div in 'info.html'.

All the process sound very complicated, so I made a drawing to explain it visually as below.

Data flow Diagram

Upvotes: 0

Views: 1261

Answers (1)

Hot_Pink_Spin
Hot_Pink_Spin

Reputation: 543

Its better to use ejs template engine.Its just like html but can access variables through pages.

1.make your submit button in 'inputdata.ejs' to redirect to '/info'

2.write a post method in the route '/info'.

3.You can access data from 'inputdata.ejs' through req.body.input_field_name, where input_field_name is specified in the form of 'inputdata.ejs'.

4.Access variables declared and assign it to the names specified in 'info.ejs'.

inputdata.ejs

<form action="/info" method="post">
    <p>Name : </p>
    <input id="team_name" type="text" name="name">
    <p>Number : </p>
    <input id="team_name" type="text" name="number">
    <input type="submit" value="Submit">
</form>

info.ejs

<p>Name is:<%=form_name%><p>

form.js

app.post('/info', function (req, res) {
var input_name = req.body.name;
var input_number = req.body.number;
res.render('info.ejs',{form_name:input_name});
})

This is a basic input form in express js.I hope this pushes u forward.Its better you look into some of express methods and ejs.

express methods,ejs

Upvotes: 1

Related Questions