How to send and array in $http.delete - angularjs

I want to delete the tag created using http post. here is the code that i have tried.
$http({
method: 'DELETE',
url: '/api/tags',
data: [vm.tags.name]
}).success(function(data) {
console.log('Gets DELETED');
vm.tags.name = data;
}).error(function(data) {
console.log('Does not get DELETED');
});
However this didn't work and it only sends an array with [null]. So is there something i don't see or understand here. I mean, if the POST works it should work the same way with DELETE, right? By the way it shows the log "Gets DELETED" but didn't do so.

I got the solution! In my case HTTP 1.1 was able to send the body, but the header was not able so use the content of JSON. So, by adding headers: {'Content-Type': 'application/json;charset=utf-8'} to the data: field of the $http.delete it worked and the array got send.
I hope this helps someone.
Thanks for the answers!

Take a look in this answer, if you send something in the body of DELETE is ignored.
You should send in the path like this:
current/path?id=1&id=2&id=3&id=4
It's like the GET method, you are not allowed to send anything in the body.
UPDATE
If you make a request with the URL parameters in the example, you will receive a object like this:
{ id : [1, 2, 3, 4] }

Related

Use array data with ng-bind-html

here is my issue.
I proceed to an ajax request which send me a value for an object (here a mission).
Then i want to print that value using ng-bind-html with angular js.
But here is the thing, the ng-bind is going to take the last value from the ajax request.
So starting with what i have right now, i wanted to use ma be an array or something else to get differents id for m data
$.each(missions, function(key,mission){
$scope.posDate="Calcul en cours";
$http({
method : "POST",
url : "getDatesBasket",
data: {"mission":mission},
async:false
}).then(function successCallback(response) {
$scope.posDate=response['data'];
},function errorCallback(response) {
$scope.posDate="ERREUR DATE";
});
var infoContent = <div ng-controller="missionCtrl"> <p ng-bind-html="posDate"></p></div>
I hope you can see the issue, each time posDate is erased by the next ending ajax request.
If you have an idea that would be great, i've spent more than 2 days with that crap.
Thank you for your help.
As long as I know that option async, that you are using, doesn't works. There is no simple way to do syncronous http requests in angular.
For your problem, if I fully understand what you want to do, you can get response.config that holds the data you've send on request and search in your missions array for that specific mission in every response that you get.
Something like this:
.then(function successCallback(response) {
$.each(missions, function(key, mission) {
if(mission == response.config.data.mission)
mission.postData = response.data; //Or wherever you want to put the data
}
}

Restangular DELETE request, send data in body

I am using restangular to send DELETE request.
I send some data in the request, and data is added to query string. But I want to use body instead of URI. I've found this question on stackoverflow. Mgonto said, that this problem can be resolved, by using customDELETE method.
I've tried something like this:
Restangular.all("all").customDELETE("one", {
firstParam: 1,
secondParam: 2
});
Unfortunately parameters still sent in the URI.
Is there any way to send parameters in body?? Like in POST request??
My teamlead helped me to find a solution!
We can use customOperation to send data in body of our request.
Here's an example:
Restangular.all("all/one").customOperation("remove", null, null, {
firstParam: 1,
secondParam: 2
});
It works fine for me!
Hope it'll help someone!

FosRestBundle + AngularJS : Post request is empty

I'm working on an API with FosRestBundle and AngularJS for the front part.
GET requests working but i have problems with POST requests. In the API controller the request object is empty..
Here is the front part
$http.post(Route.api + '/leads', {lead: "test"}).success(function(data) {
});
And here is the FosRestBundle controller
public function postAction(Request $request) {
var_dump($request->request->all()); // empty ? :(
}
Someone already have the same problem ?
Thanks ;)
Yes I had such problem, and I've solve this problem passing Content-Type header to Symfony, here is my code example
return $http({
method: 'POST',
url: Route.api + '/leads',
data: dataYouWantToSend, //see the note regarding this parameter
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})
NOTE :
If you pass data parameter with object, you will receive in in the POST your data by JSON with key of your JSON's root.
If you want to receive it like form data, you have to convert it to querystring (e.g. ?deal=test&ok=1), for example if you're using jQuery too, you can convert it like this
var dataYouWantToSendQueryString = $.param(dataYouWantToSend);
hope it will help you too.
P.S. I've researched and haven't found how to convert object to query string in angular, so if Angular has such functionality, I will glad to know about it, if someone know, please comment.

Recaptcha angularjs verify user's answer

I am using the following plugin https://github.com/VividCortex/angular-recaptcha in order to use recaptcha at a login form.
I am using the following code for verification
$http({
url: 'https://www.google.com/recaptcha/api/verify',
method: 'POST',
params: {privatekey: "key", remoteip: "userip", challenge: "challenge", response: "user_answer" },
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).success(function(data) {
console.log(data);
if (valid) {
console.log('Success');
alert('Success');
} else {
console.log('Failed validation');
alert('Fail');
// In case of a failed validation you need to reload the captcha because each challenge can be checked just once
//vcRecaptchaService.reload();
}
});
But google server is not returning anything.
I updated the code but no luck.
I think you have a typo in your code:
post: 'GET'
Change that to method: 'GET' or method: 'POST'.
You can check out angular documentation on http to make sure you've written all the params right.
If this wasn't the source of your problems, you should post more details about your issue (what do you see in your networkl console for example).
Keep in mind that recaptcha validation must be done at server-side. I'm not 100% sure that you are doing that in the browser, but your code looks like it.
As Miguel Trias stated, you shall not validate directly from angularjs/javascript client, instead you should send the challenge and response field to your server and validate then.
Therefore you can use the uri you used (https://www.google.com/recaptcha/api/verify) or a plugin, e.g. if you use php see https://developers.google.com/recaptcha/docs/php. I'd prefer a plugin because it will save work.
Furthermore keep in mind that your private key should not be used in the client, this is why it is called private. It is only used to communicate between your server and the reCaptcha servers. The public key is used to communicate between your client and the reCaptcha servers.
For more info read the Overview

Connection between Playframework and ExtJs

I am doing a project were I am trying to make the backend with playframework and the frontend with Extjs.
I can retrieve the data from the server with Json and show it in a grid with all it's fields.
The problem comes when I try to modify, remove or add any record.
The request sent by Ext: DELETE lista?_dc=1318409614652
(I solved _dc with "noCache: false" over the proxy)
The request right now is: DELETE lista
The request I need is: DELETE lista/"parameter of the object like ID or name"
Do you have any idea about this? If you need any information let me know
Thanks in advance!
I suppose you are not yet using the Rest proxy (of ExtJS) for this, but you should, as it does exactly what you are asking for. You set it up with an url like /lista in your case. Now, when you delete a record, the proxy automatically sends a DELETE request to the url, appending it with the id. Check out the documentation (linked above) for more info - you can control the url generation a little bit, but in your case it looks like you can do with the default options.
even if you don't want to use Rest Proxy, you use still use Ext.Ajax.request like below.
Ext.Ajax.request({
waitMsg: "Saving... Please wait",
url: "myserverscript.php",
method: "POST",
params: {
action: "delete",
id: myForm.down('#id').getValue(),
data: jsonData
}
});

Resources