Request body for deleting data using Angular's $http service

Below is the code snippet:

params =
  method: 'DELETE'
  url: "profiles/#{@currentProfile.id}/boxes/#{@box.id}/messages"
  data:
    ids: ids
  headers:
    "Content-Type": "application/json;charset=utf-8" 
$http(params)

After executing this DELETE request, I noticed that the request does not contain a body, meaning the "ids" parameter is missing in the body. How can I resolve this issue? I came across some suggestions on StackOverflow advising to set the 'Content-Type' header but even after doing so, it didn't solve my problem.

javascriptangularjscoffeescript

Answer №1

After thorough testing of the configuration provided (view codepen), it is evident that the request body is being successfully transmitted, as observed in the developer tools:

params =
  method: 'DELETE'
  url: "someurl"
  data:
    ids: [1,2,3]
    something: 'anything'
  headers:
    "Content-Type": "application/json;charset=utf-8" 
$http(params)

https://i.sstatic.net/emNt6.jpg

It should be noted that certain backend systems may disregard the DELETE body by default. It is recommended to reconsider your API design.

Explore more on this topic at:

  • Is an entity body allowed for an HTTP DELETE request?
  • RESTful Alternatives to DELETE Request Body

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

Issue encountered: Unable to load resource - ajax file upload failed due to net::ERR_SSL_BAD_RECORD_MAC_ALERT error

I've implemented an AJAX form file upload using jQuery. After testing my code across multiple computers and browsers, I've encountered an issue on one Windows 8 machine running Chrome where the upload functionality fails with the following error ...

javascriptphpjqueryajax

Configuring multiple views directories in Express fails to function as expected

Looking to define multiple views directories in Express. Working with Express version 4.16.3, Node.js version v10.15, and EJS version 2.5.9. app.set('views', [path.join(__dirname, 'views'), path.join(__dirname, 'public/static/&apo ...

javascriptnode.jsexpress

What is the best way to iterate through this JSON data and add it to a div in an HTML document?

Here is the structure of my JSON: { "content": [ { "title": "'I need some rest'", "description": "Descript One", "link": "http://www.google.com/?id=90#hhjjhjC-RSS", "guid": "http://www.google ...

javascriptjqueryajaxjsonjsonp

Once the image is requested in HTML, three.js makes a subsequent request for the same image

This is a block of code. let image = new THREE.TextureLoader().load("http://odf9m3avc.bkt.clouddn.com/1493817789932.jpg") <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/88/three.min.js"></script> <img class='preLoad&apo ...

javascripthtmlperformancethree.jsrequest

In Angular, the advanced search box automatically loses focus once a suggested key-value pair is selected using the

I have successfully integrated the angular-advanced-searchbox (using AngularJS 1.5.8, ui-bootstrap, JQuery) following the demo page: html <nit-advanced-searchbox ng-model="searchParams" parameters="availableSearchParams" placeholder="Search...">< ...

angularjs

Choosing a box will cause a dashed rectangle to appear when the mouse is selected

Whenever I try to select an option in my select box, a dotted rectangle appears. How do I remove this feature? https://i.sstatic.net/BzsL2.png I have noticed that many others are also facing the same issue. I tried updating my CSS with some properties ba ...

javascriptcss

Switch back and forth between words using a simulated typewriter effect in JavaScript

My current project involves writing code that will display text in a typewriter style. The code should be able to print a string, erase the last word, and type out words from an array in sequence. Each word in the array should be displayed one at a time be ...

javascripthtmlarrays

I need to improve my grasp on AngularJS Scope concept

Creating a simple example to demonstrate different behavior, I nested two div tags and named their controllers ParentController and ChildController. The same variable ($scope.mydata) was assigned to both. I expected that modifying the child would only aff ...

angularjsangularjs-scope

Ensure that the loader remains visible until all data has been successfully retrieved from the AngularJS service

Currently, I am facing an issue with the implementation of angularjs ui-router for state transitions along with a loader assigned to each view. The problem arises when moving from one state to another and the loader disappears before all the content from t ...

javascriptangularjs

Tips on triggering another action before a loop completes, involving AJAX

I've been struggling with this issue for quite some time now and I'm out of ideas. Can anyone offer assistance, please? All I want is to reload the current page after adding items to the cart. I've tried various methods like using count, pr ...

javascriptjqueryajaxforeachpromise

Inconsistent behavior of transform scale() between Chrome and Safari upon page refresh

My goal was to design a code that would adjust all content according to the browser size, ensuring that everything remains visible even when the window is resized. var docHeight = $(document).height(); var winHeight; var zoomRatio; function z(number) { ...

javascriptjquerycsscss-transformswebkit-transform

Utilize Typescript/Javascript to utilize the Gmail API for sending emails via email

I am trying to send emails from my application using my Gmail account with Ionic. I have followed tutorials from SitePoint and Google Developers. Here is how I'm initializing the client: client_id: gapiKeys.client_id, discoveryDocs: ["https://www.goo ...

javascripttypescriptemailionic-frameworkgmail

"Exploring the possibilities of Ajax in conjunction with Sol

I recently completed a tutorial on Ajax Solr and followed the instructions in step one. Below is the code I wrote: header.php: <script type="text/javascript" src="static/js/ajax-solr/core/Core.js"></script> <script type="text/javascript" s ...

javascriptjqueryajaxsolr

"Learn the process of integrating Javascript files from the Angular assets folder into a specific Angular component or module (such as Angular 2, 4,

I have custom1.js, custom2.js, and custom3.js JavaScript files that I need to load into Angular components component1, component2, and component3 respectively. Instead of adding these files to the index.html globally, I want to load them specifically for e ...

javascriptangulartypescripttypescript-typings

What is the best way to add a border around an image along with a button using VueJS?

I am struggling to link a button and an image in VueJS to display a border around the picture. While I can successfully display the border on the button, I am unsure how to extend it to the image as well. Vue.component('my-button', 'my-img& ...

javascripthtmlcssvue.jsvuejs2

My website is experiencing issues with the inner border being transparent and not displaying correctly

I have encountered an issue where the inner border only appears transparent on a single page or JSFiddle, but for some reason it is not working on my website. Can anyone offer any assistance on what might be causing this problem? The border is displaying ...

javascripthtmlcss

Foundation of Worldwide ngResource

In my angular service, I have multiple factories spread across different js files. They all require a common base for queries: 1) Authorization: Bearer token (header) (mandatory after login) 2) AccessDateTime, UserIPAddress (mandatory before login) 3) ...

angularjsngresource

Can OpenLayers library be integrated into Vue CLI 3?

I am currently trying to integrate Openlayers with vue-cli-3, but it seems like I am missing something in the process. Initially, I installed Vue CLI using the following command: npm install @vue/cli -g Next, I added additional dependencies, specifically ...

javascriptvue.jsopenlayersvue-cli

Iterate through each element in the array and manipulate the corresponding data

I am trying to figure out a way to assign a unique id to each item in an array and send it to the "script.js" file for individual data processing. <script href="script.js"></sciprt> script.js: $(function(){ $('#box' ...

javascriptphpjquery

Creating a specialized Angular directive for handling input of positive numbers

I am working on an application that requires a text field to only accept positive integers (no decimals, no negatives). The user should be restricted to entering values between 1 and 9999. <input type="text" min="0" max="99" number-mask=""> While s ...

javascriptvalidationangularjsdirective