Is it possible to remove an element from a data structure in a web application using an HTTP command?

Apologies for the confusing title, I struggled to find a better way to describe it.

Imagine sending a GET request to an API and receiving this data:

{
    {id: 1, name: "John Doe", tags: ["Apple", "Orange", "Pear"]},
    {id: 2, name: "Jane Doe", tags: ["Grape", "Banana", "Strawberry"]},
    {id: 3, name: "James Smith", tags:["Grapefruit", "Lemon", "Apricot"]}
}

If I wanted to delete the entire second object, I could use a similar approach as follows:

var request = new XMLHttpRequest();
request.open('DELETE', APIurl + "/2", true);
request.send();

However, if I only want to remove the "Banana" tag from the second object, what would be the most efficient method? One option might involve deleting the object entirely and then adding it back without the specific tag, but I wonder if there's a simpler solution available?

As someone with limited experience in working with APIs, I seem unable to solve this matter using online resources. Any help would be greatly appreciated. Thank you!

Answer №1

Using the PUT method request is essential for this task, as it provides a clear way to achieve it

var newData = {};
newData.categories = ["Apple", "Banana"];
var jsonData = JSON.stringify(newData);

request.open("PUT", APIurl+'/2', true);
request.setRequestHeader('Content-type','application/json; charset=utf-8');
request.onload = function () {
    var response = JSON.parse(request.responseText);
    if (request.readyState == 4 && request.status == "200") {
       console.table(response);
   } else {
       console.error(response);
   }
}
request.send(jsonData);

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

PHP fails to recognize Ajax POST requests

Here is a function I have created to submit forms: function submit_form(form) { $( form ).submit(function(e) { // Prevent form submission e.preventDefault(); // Get the form instance ...

Using JavaScript/TypeScript to sort through and separate two arrays

Creating a list of checkboxes on a UI allows users to toggle and filter data results. To achieve this, I am storing the selected checkboxes as a string array. The structure of my code is outlined below: export interface IMyObjectFromAPI { status: { ...

What is the method of transferring the selected tag value to PHP using Ajax post?

I am currently facing an issue with my HTML select code. Here is the snippet: <div> <select id="pickType" class="form-control select2 " name="pickType"> <option value="" selected="selected">Select Type</option> ...

Guide to changing the color of SVG images on a live webpage

I'm having trouble changing the color of a specific part within an svg image (created in Inkscape). I believe CSS is the solution, but I can't seem to select the id from the particular SVG file. The object in the SVG has the id='ToChange&apo ...

Transform a row into a clickable element

I am currently working on a social media platform where users can search for venues stored in the database. In my search.php file, I have implemented a text box that dynamically loads venue names from the database into a venuesearch div as the user types. ...

Is there a way to implement a collapse/expand feature for specific tags in React-Select similar to the "limitTags" prop in Material UI Autocomplete?

Utilizing the Select function within react-select allows me to select multiple values effortlessly. isMulti options={colourOptions} /> I am searching for a way to implement a collapse/expand feature for selected tags, similar to the props fun ...

Is the contenteditable feature working properly when updating PHP, SQL, and AJAX in the network?

Struggling with updating modified text to SQL using PHP and Ajax. Unsure if the issue lies in the data sent through Ajax or a problem within the PHP script. Below is my snippet from the HTML file: <tr> <td class="editingTab" contenteditable=&ap ...

Initiate an AJAX request to log out of my account

Currently, I have a Rails 3 application where I am implementing Warden for authentication purposes. Everything functions properly except for when I attempt to access one of the controllers using AJAX(POST), it automatically logs me out and prompts me to ...

Vue.js blocks the use of iframes

I've come across a peculiar issue where I need to embed an iframe inside a Vue template and then be able to modify that iframe later. The code snippet below shows the simplified version of the problem: <html> <body> <div id="app" ...

Best practices for displaying code blocks within an AngularJS application

Currently, I am in the process of building a website focusing on AngularJS within AngularJS ;-) To accomplish this, I have included ng-app within the body element. As a result, all my code snippets (enclosed in <pre><code> ... </code>&l ...

ERROR UnhandledTypeError: Unable to access attributes of null (attempting to retrieve 'pipe')

When I include "{ observe: 'response' }" in my request, why do I encounter an error (ERROR TypeError: Cannot read properties of undefined (reading 'pipe'))? This is to retrieve all headers. let answer = this.http.post<ResponseLog ...

Requesting a download of a file via an Ajax call from a RESTful service

I'm still getting the hang of AJAX. I've set up a request to send to the server using AJAX, and the service returns a text file. However, when the data is returned, no download box pops up. Here's the REST service that sends back the file: ...

How can I dynamically change the default value of the selected option dropdown in React-Select when a new option is chosen?

Can you help me understand how to update the default displayed value on a dropdown in a react-select component? When I choose a different option from one dropdown, the select dropdown value does not change. I've attempted this.defaultValue = option.va ...

The system is currently unable to find the specified element

I am facing an issue trying to locate a button that is defined under a specific class using XPATH. The error message "Unable to locate element" keeps popping up. Here are the details of the class: <div class="aui-button-holder inputBtn" id="aui_3_4_0_1 ...

I received no response when I checked my Discord messages

I'm currently working on creating a bot that will send a daily morning message at 9 o'clock with a customizable reaction. Right now, it's successfully sending the message on Discord but there seems to be an issue with the reaction part. Can ...

What are some strategies to reduce the frequency of API calls even when a webpage is reloaded?

Imagine I'm utilizing a complimentary API service that has a restriction of c calls per m minutes. My website consists of a simple HTML file with some JavaScript code like the one below: $(function () { //some code function getSomething() { ...

Steps to build a website with working AJAX functionality

Recently, I installed the AJAX-ToolKit in my VS 2005 (c#) and now have access to Ajax controls in my toolbox. However, I am facing issues with creating an AJAX-Enabled template for my website. Can someone please help guide me on how to set up and configur ...

How can I best access the object being exposed on the webpage using <script type="text/json" id="myJSON">?

In our current project, we are successfully using AMD modules to organize and structure our code. One idea I have is to create an AMD module that accesses a script tag using a jQuery ID selector and then parses the content into JSON format. Here's an ...

Acquiring a property from an object that is specified within a function

I have created an object with properties inside a function: function createObject() { const obj = { property1: value, property2: value } } How can I access this object from outside the function? Would redefining it like ...

Generating HTML tables with charts using FireFox

I am encountering an issue: My table contains charts and tables that are displayed correctly in browsers. However, when I attempt to print it (as a PDF) in Mozilla Firefox, the third speedometer gets cut off, showing only 2.5 speedometers. Using the "s ...