Sending information from Vue to Express for processing

Is there a way to pass data from Vue to an express server? For example, in the scenario below, I am looking to send the data logged in my Vue function to the "id" variable on the server side.

expressApp.post('/delete' , function (request, response) {

    const id = request.body.id;
    console.log(id)

        MongoClient.connect(url, function (err, db) {

            if (err) throw err;
            let dbo = db.db(dbName);

            dbo.collection("Members").deleteOne({"_id": objectId(id)}, function (err, res) {
                if (err) throw err;
                db.close();
            });
        });
    response.redirect('/agileApp');
    });


t: function (index) {
            fetch(membersUrl).then(function(response) {
                return response.json();
            }).then(function (data) {
                const formData = new FormData();
                formData.append("id", data[index]._id);
                for (var pair of formData.entries()) {
                    console.log(pair[0]+ ', ' + pair[1]);
                }

                fetch(deleteUrl, {
                    method: 'POST',
                    body: formData
                })
            })
        }

Answer №1

expressApp.post('/delete' , function (request, response) {
    const id = request.body.id; // <--- retrieve id from the request body

        MongoClient.connect(url, function (err, db) {

            if (err) throw err;
            let dbo = db.db(dbName);

            dbo.collection("Members").deleteOne({"_id": objectId(id)}, function (err, res) {
                if (err) throw err;
                db.close();
            });
        });
    response.redirect('/agileApp');
    });


t: function (index) {
            fetch(membersUrl).then(function(response) {
                return response.json();
            }).then(function (data) {
                const formData = new FormData();
                formData.append("id", data[index]._id);

                fetch('/delete', {
                  method: 'POST', // <--- send POST request via fetch
                  body: formData
                })
            })
        }

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

When trying to convert to JSON in node, the process fails. However, the data can still be

I am currently working on converting an array to JSON in order to send it to a client. The data I see in the console is as follows: [ NL: [ true, true, true, true, true, true, true, true, true, true, true, true ], ...

Traverse JSON data using associative loops

Is there a way for me to iterate through this JSON data without using numerical indexes? I want to treat it like an associative array. This is what I have so far: $.post('/controlpanel/search', { type: type, string: string }, function(data){ ...

Guide to configuring a robust schema and validation with joi

Currently in the process of setting up validation using the joi package, encountering syntax-related issues along the way. The schema in place is simple, checking for a valid number and verifying if the ID exists in the database. export default router.pos ...

"JavaScript throws an 'Undefined' error when trying to access a basic

I am struggling with a basic set of HTML and JS files that are not functioning properly, and I can't seem to pinpoint the issue: <html> <head> <script type="text/javascript" src="data.json"></script> < ...

Combining round brackets and square brackets when initializing an array

In the snippet below, values are assigned with a mix of parentheses and square brackets without any errors. However, most other combinations (such as parentheses inside square brackets) do not work at all. var myItems = []; myItems[5] = ("A1", "B1", ["C1" ...

Transferring JSON information to the database via Postman results in an error code 500

I encountered an internal server error while trying to send JSON data using Postman. I have ensured that the connections and schemas are properly established, but I am unable to pinpoint the source of this error. CODE const asyncHandler = require("exp ...

Having trouble displaying results in Vue.js after making an API request?

I am facing challenges in displaying the results using vue.js. The data from my API (ASP.NET CORE) is being retrieved successfully, as shown in my vue dev tools on Google Chrome. However, I am encountering difficulties in rendering the results on the brows ...

Navigating the challenges presented by CORS (Cross-Origin Resource Sharing) and CORB (Cross-Origin Read Blocking) when utilizing the FETCH API in Vanilla Javascript

Looking to update text on a website using data from a JSON file on another site? This scenario is unique due to restrictions - can't use JQuery or backend elements like Node/PHP. Wondering if vanilla JavaScript can solve the problem? While some worka ...

Refresh the Content of a Page Using AJAX by Forcing a Full Reload

I have a webpage that automatically updates a section using jQuery AJAX every 10 seconds. Whenever I modify the CSS or JavaScript of that page, I would like to include a script in the content fetched via AJAX to trigger a full page reload. The page is ac ...

Is it possible to iterate through option values in a v-select using v-for?

Just starting out with VueJS and trying to create a select dropdown using vuetify. I have a variable from the database that I want to use to generate the options using v-for. I tried a few approaches but could not get it to work effectively. Here is what I ...

Is it possible to utilize AJAX requests in order to create a marker on google maps that updates in real-time?

My goal is to develop an app that generates a real-time updating google map, and I have been advised that AJAX requests can help achieve this. Nevertheless, after studying the documentation, I am uncertain about how to apply this method to solve my issue ...

Error message "Truffle 'Migrations' - cb is not a valid function"

I created a straightforward smart contract using Solidity 0.6.6 and now I'm attempting to deploy it on the BSC Testnet. Here's what my truffle-config.js file looks like (privateKeys is an array with one entry ['0x + privatekey']): netw ...

The canDeactivate function in the Angular 2 router can modify the router state even if I choose to cancel an action in the confirmation popup

In my Angular 2 project, I have implemented the canDeactivate method to prevent browser navigation. When a user tries to leave the page, a confirmation popup is displayed. However, if the user chooses to cancel, the router still changes its state even th ...

Guide to initiating a node.js socket.io server through a brackets extension

I am currently working on developing a brackets extension that involves sending data to a server. What I aim to do is execute a server.js file from my main.js file, which will create a node.js socket.io server. Once this server is set up, the extension sho ...

Choose either immediate offspring or immediate offspring of immediate offspring

I am struggling to create a CSS Selector that follows DRY principles. The selector needs to target elements within a group but not those within a subgroup of the main group. Elements should only be direct children of the main group or wrapped in an addit ...

Steps for comparing two inputs and displaying a div:1. Obtain the values of

I am looking to create a basic JavaScript function that will show or hide an element based on whether two input values match. This needs to happen before the form is submitted. <form> <input type="number" name="some1" id="some1"> <input t ...

Updating state based on input from a different component

I am attempting to modify the state of the page index in index.js from the Pagination component, Here is my index.js code: import useSWR from 'swr'; import { useState } from 'react'; const Index = ({ data }) => { const ini ...

The git clone operation encounters a problem with the error message: unable to connect, connection refused on localhost port 80

Currently for my project, I'm utilizing isomorphic-git. However, when I try to implement the git.clone function, I encounter the error message Error: connect ECONNREFUSED 127.0.0.1:80. To provide an example of what I am attempting to achieve: import ...

jQuery Datatables causing hyperlinks to malfunction on webpage

After implementing jQuery datatables on this example using a PHP serverside processing file pulling data from MySQL, the Sign-in button used to work but now it just reloads the same index page. Manually typing in the address linked to the Sign In page work ...

What is the method for displaying data on a browser instead of downloading it when creating a link?

Clicking on this link will trigger the download of the f.txt file. Rather than downloading it, I would like the data to be displayed directly in the browser. For example, when you click this link, the data is shown directly in the browser. While I have ...