Skip to content

Instantly share code, notes, and snippets.

@soufianeEL
Forked from JeffreyWay/laravel.js
Last active June 18, 2023 05:25
Show Gist options
  • Save soufianeEL/3f8483f0f3dc9e3ec5d9 to your computer and use it in GitHub Desktop.
Save soufianeEL/3f8483f0f3dc9e3ec5d9 to your computer and use it in GitHub Desktop.
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
Copy link

Hey, Thanks alot!

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

@smontanoq
Copy link

Great, thanks for the update :)

@ziscloud
Copy link

Nice job ;)

@ricardobarantini
Copy link

Thanks! 👍

@fer-ri
Copy link

fer-ri 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
Copy link

Thanks! 👍

@janzenz
Copy link

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
Copy link

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
Copy link

thanks its work!

@CristianLlanos
Copy link

Cool! 👍

@Sharvadze
Copy link

Doesn't work for me, redirects to view method

@hosquiat
Copy link

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

@huseyindol
Copy link

Great, thanks for the update :)

@GoodJob
Copy link

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