MongoDB Put/ Update :: TypeError: {(intermediate value)} is not a function

Question

I am currently doing a Full Stack Web Developer Bootcamp course and have been tasked with the creation of my first MERN Stack application using the CRUD operations.

When updating an individual item, I receive the following error:

TypeError: {(intermediate value)} is not a function

My code is as follows:

• Server: carsController.js:

exports.updateOneController = (req, res) => {
  Car.findByIdAndUpdate(
    req.params.id,
    { new: true }({
      $set: {
        Model: req.body.Model,
        Make: req.body.Make,
        Owner: req.body.Owner,
        Registration: req.body.registration,
        Address: req.body.Address,
        previousOwners: req.body.previousOwners,
      },
    })
  );

  Car.save()
    .then((cars) => res.json(cars))
    .catch((err) => res.status(400).json("Error updating the car." + err));
};

• Server: carsRouter.js:

router.put("/updateOne/:id", cars.updateOneController);

• Client: carEdit.js:

const updateOne = (e) => {
    e.preventDefault();

    axios
      .put(`cars/updateOne/${id}`, {
        method: "PUT",
        headers: {
          Accept: "application/json",
          "Content-Type": "application/json",
        },
        body: JSON.stringify({
          Model: Model,
          Make: Make,
          Owner: Owner,
          Registration: Registration,
          Address: Address,
          previousOwners: previousOwners,
        }),
      })
      .then((response) => {
        Swal.fire({
          imageUrl: "./images/success.gif",
          imageWidth: 150,
          imageHeight: 150,
          imageAlt: "Error",
          confirmButtonColor: "#007aff",
          width: 400,
          title: "SUCCESS!",
        });
        setCars(response.data);
      })
      .catch((error) => {
        console.log(error);
        Swal.fire({
          imageUrl: "./images/exclamation.gif",
          imageWidth: 150,
          imageHeight: 150,
          imageAlt: "Error",
          confirmButtonColor: "#ff0000",
          width: 400,
          title: "ERROR!",
          text: "User data missing",
        }).then(function () {
          window.location.reload();
        });
      });
  };

            <Button
              type="button"
              title="Update a Car"
              onClick={(e) => updateOne(e)}
            >
              <FontAwesomeIcon icon={faEdit} />
              <span id="editone">x1</span> Update
            </Button>

I am not sure whether this is a collision between findByIdAndUpdate() and save()?

Please see here the link to the GitHub repository: https://github.com/ChanBos/MERN-Cars-Database-Application

Answer 1

You're missing a comma on line 4 in the server code, causing it to interpret the following parentheses as a call operation.

Your code should be:

exports.updateOneController = (req, res) => {
  Car.findByIdAndUpdate(
    req.params.id,
    { new: true }, ({  // This is the changed line
      $set: {
        Model: req.body.Model,
        Make: req.body.Make,
        Owner: req.body.Owner,
        Registration: req.body.registration,
        Address: req.body.Address,
        previousOwners: req.body.previousOwners,
      },
    })
  );

  Car.save()
    .then((cars) => res.json(cars))
    .catch((err) => res.status(400).json("Error updating the car." + err));
};

I assume you're not using one of the common editors/IDE's, as they can show you the exact instruction that caused this error, making it much easier to fix. Programmers can get very religious about their editors, but there a number of solid choices for Node.js. I personally use VS Code, but there are plenty of good options. I highly recommend finding a good editor, and if you are already using one, then definitely utilize their debugging tools to track down these kinds of errors.