Form action GET input | The Ubmit button sends the path of the action + ? id="what the user typed"'

Question

I did a lot of research on how to do this and I got no response. Here’s the situation: I have a listById method that needs to get the id that comes in the URL through the form. It turns out that when I submit the form, it forwards to the URL that is in the action + ? id=#o_que_o_usuário_digitou#. Hence my route manager cannot handle this.

HTML:

<form class="container" action="/listById/" method="GET">
        <input class="form-control" type="text" name="id" id="id">
        <button id="btn-search" class="btn btn-primary" type="submit">Search</button>
    </form>

Route manager:

app.get('/listById/:id', controlcontact.listById);

METHOD called on the route:

contact.listById = (req,res)=>{

request.get(externalApi+req.params.id,
    (error, response, body) => {
        res.render('listById',{
            contact: JSON.parse(body)
        })
    });  
}

Example: if the input is typed "12345", Submit forwards to "/listById/? id=12345" I wanted to solve this only using HTML, without having to create javascript function.

Answer 1

That’s right, what the user sends will be submitted as parameters in URI format.

On the server side you need to parse these parameters using url.parse(req.url, true). If you use express, this is already done automatically by a middleware for you, rather than using req.params.id, you must access this value in req.query.id.

Also, there is no need to declare the id in your route manager, just app.get('/listById', controlcontact.listById);