PUT front-end in RESTful api

317 Views Asked by At

I'm making a simple website with an api using node, express, and mongo with a simple edgejs for front-end. All routes are working in postman (GET, POST, PUT, DELETE). However, HTML5 does not support the PUT method. Here is one example.

Index.js

... 
app.put('/api/item/:id', function(req, res, next){
      About.findByIdAndUpdate({_id: req.params.id}, req.body)
      .then(function(){
        About.findOne({_id: req.params.id})
        .then(function(about){
          res.send(about)
        });
      }).catch(next)
    });

This works fine in postman. Here's what I initially had in my view.

edititem.edge

    ...
    <form 
     action="/api/item/{{item._id}}" 
      method="PUT"
      encType="multipart/form-data">
        <div class="form-group">
          <label for="title">Name</label>
          <input type="text" class="form-control" name="name" placeholder="Name">
        </div>
        <div class="form-group">
          <label for="description">Profession</label>
          <input type="text" class="form-control" name="profession" placeholder="Profession">
        </div>
        <div class="form-group">
          <label for="description">Description</label>
          <input type="text" class="form-control" name="description" placeholder="Description">
        </div>
        <div class="form-group">
          <label for="description">Email</label>
          <input type="text" class="form-control" name="footerEmail" placeholder="Email">
        </div>
        <div class="form-group">
          <label for="content">Footer Description</label>
          <textarea name="footerDescription" id="" class="form-control" rows="10" placeholder="Footer Description"></textarea>
        </div>
        <div class="form-group text-center">
            <button class="btn btn-primary">Edit Item</button>
          </div>
      </form>

I considered binding a function to the edit button to just delete the previous item and create a new one with the updated content, but that can't be best practice, can it? That would change the id, and from what I've seen in Postman, a proper PUT doesn't change the id. My idea to delete and replace would.

So how do I allow this item to be edited from the front end?

0

There are 0 best solutions below