Laravel 4 et Ajax

Dans cet article, voyons comment implémenter une requête Ajax (XHR) avec le framework Laravel.

Implémenter une requête Ajax au sein d’un projet Laravel n’est pas bien compliqué. Dans ce bref exemple, j’ai un tableau de données (non présent dans le billet), un des champs est une icône de statut de l’enregistrement qui peut-être actif ou non, et lorsque l’on clique sur ce bouton, l’état bascule en faisant une requête XHR.

La partie javascript va se trouver dans la vue en question (celle qui affiche le tableau). Lorsque le bouton est cliqué, jQuery.ajax() va déclencher l’exécution de l’action getToggleVisibility() du controlleur courrant, DasboardController dans notre exemple, celui-ci va retourner une réponse JSON qui est utilisée pour intéragir sur la vue. Et le tour est joué.

Un peu de code

Il faut tout d’abord avoir une route correcte pour notre « méthode Ajax ». Dans mon cas, mon application étant RESTful, j’ai un routage au niveau du controlleur dans le routes.php de Laravel, comme ceci :

Route::controller('dashboard', 	'DashboardController');

Mais autrement, pour ne s’occuper que de cet exemple, un simple routage sur l’action se fait comme ceci :

Route::get('toggle-visibility', array('uses' => 'dashboard@toggleVisibility'));

Le fichier javascript à intégrer dans le fichier de vue est le suivant :

$(function() {
	$('.toggle-visibility').click(function() {
		$.ajax({
			type: "get",
			url: "/dashboard/toggle-visibility/" + $(this).attr('id'),
		})
		.done(function( data ) {
			
			/*
			 * Eventuellement plus de choses à faire
			 * lorsque la requête est effectuée
			 */
		 
		});

		return false;
	});
});

Et voici la méthode d’action dans notre controlleur :

public function getToggleVisibility($id) {
	if (Request::ajax()) {
		
		/*
		 * Du code quelconque
		 * renvoyant quelques infos
		 * pour une réponse JSON
		 */
		
		
        $response = array(
            'result' 	=> 'success',
            'id' 		=> $id
        );

        return Response::json($response);
    }
}

1 thought on “Laravel 4 et Ajax”

  1. Bonjour, merci pour cette explication. Pour ma part, j’utilise Lumen. La syntaxe est différente mais assez semblable.

    Est ce normal d’obtenir un double appel ajax, dont un est une redirection ?

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *