Question 219431 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Cannot POST / – URL with parameters

I’m trying to post something, but always get error.

articlesRouter.post('articles/:target', async (req, res) => {
    const target = req.params.target.replaceAll("_", " ")
    const article = await Article.findOne({where: {title: target}})
    if (article)
    {
        const author = req.body.commentAuthor
        const text = req.body.commentText
        await article.createComment({author, text})
        console.log("POST METHOD IS WORKING")
    }
})

Form:

 <form method="post">
            <textarea placeholder="Title of your article" id="title" name="articleTitle"></textarea>
            <br />
            <textarea placeholder="Body of your article" id="body" type="text" name="articleBody"></textarea>
            <br />
            <button id="submit" type="submit">Done</button>
        </form>

GET method

articlesRouter.get('/articles/:target', async (req, res) => {
    const target = req.params.target.replaceAll("_", " ")
    const searchResult = await Article.findOne({where: {title: target}})
    if (searchResult)
    {
        const correspondingComments = await searchResult.getComments()
        res.render('../views/currentArticle', {title: searchResult.title, text: searchResult.body, comments: correspondingComments})
    }
    else{
        console.log('Error')
    }
})

How you can see, path to article consists of /articles and /title_of_article. I think that problem at this line articlesRouter.post('articles/:target'.....

May be I can’t use post method with /:params???
Thanks for reading!

Tags:

2

Answers


  1. 0

    To fix this, you need to make sure that the names of the form fields match the keys you are accessing in the server-side code. Here’s how you can update your form to match the expected keys:

    <form method="post">
  <textarea placeholder="Title of your article" id="title" name="commentAuthor"></textarea>
  <br />
  <textarea placeholder="Body of your article" id="body" type="text" name="commentText"></textarea>
  <br />
  <button id="submit" type="submit">Done</button>
</form>
    Login or Signup to reply.
  2. 0
    • If you POST a form, you will get the input in the req.body, not in req.params.
    • Remove the param :target from route path and probably you
      need a ‘/’ before articles for a complete route path.
    • Send a response like res.status(200).end(), res.send(‘ok’), … to finish the request.

    Form:

    <!DOCTYPE html>
<html>
<head>
  <title>Form</title>
</head>
<body>
  <form method="post" action="/test/articles">
    <textarea placeholder="Title of your article" id="title" name="articleTitle"></textarea>
    <br />
    <textarea placeholder="Body of your article" id="body" type="text" name="articleBody"></textarea>
    <br />
    <button id="submit" type="submit">Done</button>
  </form>
</body>
</html>

    app.js:

    ...
const testRouter = require('./routes/test');
...
app.use('/test', testRouter);
...

    test.js:

    const express = require('express');
const articlesRouter = express.Router();

articlesRouter.post('/articles', (req, res) => {
  const target = req.body.articleTitle.replaceAll("_", " ")
  console.debug(target)
  // ... your DB access code
  res.send('ok')
})

module.exports = articlesRouter;
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search