Como enviar uma solicitação PUT / DELETE no jQuery?

555

GET:$.get(..)

POST:$.post()..

Que tal PUT/DELETE?

user198729
fonte
Melhor que precisamos de carregamento bem
Hos Mercury

Respostas:

924

Você pode usar o método ajax :

$.ajax({
    url: '/script.cgi',
    type: 'DELETE',
    success: function(result) {
        // Do something with the result
    }
});
Darin Dimitrov
fonte
65
Apenas uma observação, se você estiver usando um servidor Web IIS e o jquery PUTou os DELETEpedidos estiverem retornando erros 404, será necessário habilitar esses verbos no IIS. Descobri que este é um bom recurso: geekswithblogs.net/michelotti/archive/2011/05/28/…
TimDog
22
TENHA CUIDADO: "The type of request to make ("POST" or "GET"), default is "GET". Note: Other HTTP request methods, such as PUT and DELETE, can also be used here, but they are not supported by all browsers."a partir de: api.jquery.com/jQuery.ajax/#options
andilabs
23
@andi Conforme stackoverflow.com/questions/1757187/…, qualquer navegador do IE6 suporta esses métodos http. A menos que você esteja desenvolvendo um navegador antigo , poderá usar com segurança métodos http além de "GET" e "POST".
Martin Carney
1
Além disso, você não pode passar dados de formulário . Tem que passar pelo URI.
xavier 29/06
6
para versões posteriores à 1.9, você pode usar methodoutype
sites
124

$.ajax vai funcionar.

$.ajax({
   url: 'script.php',
   type: 'PUT',
   success: function(response) {
     //...
   }
});
Jacob Relkin
fonte
4
PUT é precisocontentType: "application/json"
KingRider
3
Existe alguma diferença entre essa resposta e a de Darin Dimitrov? Suponho que ambos foram criados ao mesmo tempo e, portanto, não houve plágio, mas não vejo o que essa resposta acrescenta (além da reputação de 940 para Jacob).
Andrew Grimm
72

Podemos estender o jQuery para criar atalhos para PUT e DELETE:

jQuery.each( [ "put", "delete" ], function( i, method ) {
  jQuery[ method ] = function( url, data, callback, type ) {
    if ( jQuery.isFunction( data ) ) {
      type = type || callback;
      callback = data;
      data = undefined;
    }

    return jQuery.ajax({
      url: url,
      type: method,
      dataType: type,
      data: data,
      success: callback
    });
  };
});

e agora você pode usar:

$.put('http://stackoverflow.com/posts/22786755/edit', {text:'new text'}, function(result){
   console.log(result);
})

copiar daqui

Stepan Suvorov
fonte
Excluir não espera dados quando colocar a faz, não quer dizer que $ .get e US $ .post pode ter assinaturas diferentes enquanto aqui estiver hardcoding-lo a um
Francisco Presencia
1
@FranciscoPresencia - 1. A exclusão não espera dados enquanto a put faz ----> A terceira linha lida com esse cenário 2. $ .get e $ .post podem ter assinaturas diferentes ----> Isso está apenas criando métodos jquery adicionais para excluir e colocar. get e post têm seus próprios métodos jquery.
Mahesh
10

A partir daqui , você pode fazer isso:

/* Extend jQuery with functions for PUT and DELETE requests. */

function _ajax_request(url, data, callback, type, method) {
    if (jQuery.isFunction(data)) {
        callback = data;
        data = {};
    }
    return jQuery.ajax({
        type: method,
        url: url,
        data: data,
        success: callback,
        dataType: type
        });
}

jQuery.extend({
    put: function(url, data, callback, type) {
        return _ajax_request(url, data, callback, type, 'PUT');
    },
    delete_: function(url, data, callback, type) {
        return _ajax_request(url, data, callback, type, 'DELETE');
    }
});

É basicamente apenas uma cópia do $.post()parâmetro de método adaptado.

user2503775
fonte
9

Aqui está uma chamada ajax atualizada para quando você estiver usando JSON com jQuery> 1.9:

$.ajax({
    url: '/v1/object/3.json',
    method: 'DELETE',
    contentType: 'application/json',
    success: function(result) {
        // handle success
    },
    error: function(request,msg,error) {
        // handle failure
    }
});
humor
fonte
5

Você deve ser capaz de usar jQuery.ajax:

Carregue uma página remota usando uma solicitação HTTP.


E você pode especificar qual método deve ser usado, com a typeopção :

O tipo de solicitação a ser feita (" POST" ou " GET"), o padrão é " GET".
Nota: Outros métodos de solicitação HTTP, como PUTe DELETE, também podem ser usados ​​aqui, mas eles não são suportados por todos os navegadores.

Pascal MARTIN
fonte
4
você sabe quais navegadores não suportam PUTou DELETE?
Lea Hayes
4
Os partidos, se eles não são capazes de HTTP: ^)
XTL
4

ajax ()

procure o tipo param

Outros métodos de solicitação HTTP, como PUT e DELETE, também podem ser usados ​​aqui, mas eles não são suportados por todos os navegadores.

antpaw
fonte
3

Por uma questão de brevidade:

$.delete = function(url, data, callback, type){

  if ( $.isFunction(data) ){
    type = type || callback,
    callback = data,
    data = {}
  }

  return $.ajax({
    url: url,
    type: 'DELETE',
    success: callback,
    data: data,
    contentType: type
  });
}
Paul Wand
fonte
Nenhum campo de dados, eu acho.
Bob
1

Você pode fazer isso com o AJAX!

Para o PUTmétodo:

$.ajax({
  url: 'path.php',
  type: 'PUT',
  success: function(data) {
    //play with data
  }
});

Para o DELETEmétodo:

$.ajax({
  url: 'path.php',
  type: 'DELETE',
  success: function(data) {
    //play with data
  }
});
Xanarus
fonte
7
Isso já foi dito anos antes de você postar esta resposta. Isso é apenas ruído, adicionando totalmente nada de novo.
Shadow Wizard é Ear For You
0

Se você precisar fazer um $.posttrabalho em um Laravel Route::deleteou Route::putapenas adicionar um argumento "_method"="delete"ou "_method"="put".

$.post("your/uri/here", {"arg1":"value1",...,"_method":"delete"}, function(data){}); ...

Deve funcionar para outros frameworks

Nota: Testado com o Laravel 5.6 e jQuery 3

Marcos Regis
fonte
-1

Você pode incluir no seu hash de dados uma chave chamada: _method com o valor 'delete'.

Por exemplo:

data = { id: 1, _method: 'delete' };
url = '/products'
request = $.post(url, data);
request.done(function(res){
  alert('Yupi Yei. Your product has been deleted')
});

Isso também se aplica a

mumoc
fonte
3
Isso apenas faz um post.
CTRL-ALT-DELOR
1
Isso funcionará com os trilhos, o _method é usado para encapsular métodos http sobre POST (embora você provavelmente deva usar isso apenas com formulários - eles só conseguem obter / publicar).
opsb
Isso também funcionará com o Laravel se você estiver fazendo isso de um formulário com o método POST.
John Shipp
-1

Aqui está uma linha simples que eu uso para colocar mais de uma variável:

$.put("https://your-url.com",{item1:'new item1',item2:'new items2'});

David White
fonte
Isso não funciona com o jQuery pronto para uso.
Colin 'Hart Hart
funciona no nó / expresso
David White