jQuery: gestione flessibile dei link AJAX

jQuery: gestione flessibile dei link AJAX

Il problema dei link usati per richieste AJAX è che spesso ci costringono a duplicare il codice più e più volte. Vediamo come sfruttare l'estensibilità di jQuery per ovviare questa situazione.

Presupponendo che i dati della query siano contenuti negli URL dei link (cosa consigliabile qualora JavaScript fosse disabilitato), possiamo implementare il seguente plugin:


(function($) {

	$.fn.ajaxLink = function(options) {
	
		
		
		options = $.extend({
			type: 'GET',
			dataType: 'text',
			url: '',
			data: '',
			success: function() { },
			complete: function() { }
		}, options);
		
		return this.each(function() {

		    var that = $(this);
			var href = that.attr('href');
			var data = href.substring(href.indexOf('?') + 1, href.length);
			options.data = data;
		
			that.on('click', function(evt) {
			
				evt.preventDefault();
				
				$.ajax(options);
			
			
			});
		
		
		});
	
	
	};
})(jQuery);

Questo semplice codice può essere ulteriormente esteso utilizzando gli attributi di dati HTML5 per aggiungere altri parametri alla query.

Torna su