Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
You use Laravel 5 and you want to send a DELETE request without creating a form? This will handle the form-creation bits for you dynamically, similar to the Rails implementation. To use, import script, and create a link with the `data-method="DELETE"` and `data-token="{{csrf_token()}}"` attributes.
/*
Exemples :
<a href="posts/2" data-method="delete" data-token="{{csrf_token()}}">
- Or, request confirmation in the process -
<a href="posts/2" data-method="delete" data-token="{{csrf_token()}}" data-confirm="Are you sure?">
*/
(function() {
var laravel = {
initialize: function() {
this.methodLinks = $('a[data-method]');
this.token = $('a[data-token]');
this.registerEvents();
},
registerEvents: function() {
this.methodLinks.on('click', this.handleMethod);
},
handleMethod: function(e) {
var link = $(this);
var httpMethod = link.data('method').toUpperCase();
var form;
// If the data-method attribute is not PUT or DELETE,
// then we don't know what to do. Just ignore.
if ( $.inArray(httpMethod, ['PUT', 'DELETE']) === - 1 ) {
return;
}
// Allow user to optionally provide data-confirm="Are you sure?"
if ( link.data('confirm') ) {
if ( ! laravel.verifyConfirm(link) ) {
return false;
}
}
form = laravel.createForm(link);
form.submit();
e.preventDefault();
},
verifyConfirm: function(link) {
return confirm(link.data('confirm'));
},
createForm: function(link) {
var form =
$('<form>', {
'method': 'POST',
'action': link.attr('href')
});
var token =
$('<input>', {
'type': 'hidden',
'name': '_token',
'value': link.data('token')
});
var hiddenInput =
$('<input>', {
'name': '_method',
'type': 'hidden',
'value': link.data('method')
});
return form.append(token, hiddenInput)
.appendTo('body');
}
};
laravel.initialize();
})();
@donedgardo

This comment has been minimized.

Copy link

@donedgardo donedgardo commented Jul 6, 2015

Hey, Thanks alot!

Going to use this in my interview test!
Again! Thanks for the update to 5.0^

@smontanoq

This comment has been minimized.

Copy link

@smontanoq smontanoq commented Sep 7, 2015

Great, thanks for the update :)

@ziscloud

This comment has been minimized.

Copy link

@ziscloud ziscloud commented Sep 15, 2015

Nice job ;)

@ricardobarantini

This comment has been minimized.

Copy link

@ricardobarantini ricardobarantini commented Oct 1, 2015

Thanks! 👍

@ghprod

This comment has been minimized.

Copy link

@ghprod ghprod commented Oct 6, 2015

Hi all,

i've change a little bit to support jQuery promise so you can use any confirm action like bootbox or swal 👍

https://gist.github.com/ghprod/0bb7f8d207ba7838a0e6

Thanks

@wedojava

This comment has been minimized.

Copy link

@wedojava wedojava commented Jan 14, 2016

Thanks! 👍

@janzenz

This comment has been minimized.

Copy link

@janzenz janzenz commented Jan 20, 2016

Got a problem with this. I get redirected to the href link and doesn't trigger the events registered above. However when I do debug console and traverse through the handleMethod it submits fine. Should I place this inside $(function(){})?

@janzenz

This comment has been minimized.

Copy link

@janzenz janzenz commented Jan 20, 2016

It's actually triggering the handleMethod method. However, the reason for the redirection was because the e.preventDefault() wasn't triggered so the link automatically redirects without calling the form.submit() first.

@ridwanssyh

This comment has been minimized.

Copy link

@ridwanssyh ridwanssyh commented Aug 19, 2016

thanks its work!

@CristianLlanos

This comment has been minimized.

Copy link

@CristianLlanos CristianLlanos commented Feb 21, 2017

Cool! 👍

@Sharvadze

This comment has been minimized.

Copy link

@Sharvadze Sharvadze commented Sep 6, 2017

Doesn't work for me, redirects to view method

@sogeniusio

This comment has been minimized.

Copy link

@sogeniusio sogeniusio commented Sep 18, 2017

Same here, doesn't work for me redirecting to view.

@huseyindol

This comment has been minimized.

Copy link

@huseyindol huseyindol commented Dec 18, 2017

Great, thanks for the update :)

@GoodJob

This comment has been minimized.

Copy link

@GoodJob GoodJob commented May 17, 2018

no idea why, but doesn't work :(

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment