jQuery: memorizzare il numero di download di un file

Possiamo usare jQuery per svolgere vari còmpiti, uno dei quali è memorizzare il numero di download per ciascun file del nostro sito. Per questo occorre un database ed uno script lato server per registrare effettivamente i dati passati da jQuery. Vediamo come.

Nel nostro database, creiamo questa ipotetica tabella:

CREATE TABLE `downloads` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `file` varchar(255) COLLATE utf8_unicode_ci NOT NULL,
  `downloaded` int(11) NOT NULL DEFAULT '0',
  PRIMARY KEY (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci AUTO_INCREMENT=3 ;

file è il nome del file completo di estensione e downloaded è un intero che verrà incrementato ad ogni clic sul pulsante di download. A noi interessa solo che jQuery passi al nostro script il nome del file per poter effettuare l'aggiornamento sul database. Ecco lo script lato server (ipersemplificato):

$filename =  $_POST['file'];
	
	// @todo Aggiungere validazione	
	
	
	$connection = mysql_connect('host', '------', '------');
	mysql_select_db('test', $connection);
	$query = "SELECT downloaded FROM downloads WHERE file = '$filename'";
	
	$result = mysql_query($query);
	
	$results = mysql_fetch_array($result);
	
	$downloaded = intval($results['downloaded']);
	$updated = $downloaded + 1;
	
	$update_query = "UPDATE downloads SET downloaded = $updated WHERE file = '$filename'";
	
	mysql_query($update_query);

Come si può notare, il nome del file viene usato per individuare il file di cui vogliamo registrare il numero di download. jQuery deve semplicemente passare il parametro file contenente il nome del file, che inseriremo nell'HTML attraverso l'attributo rel del link corrispondente:

$(function() {

	$('a.download-link', document.body).each(function() {
	
		var $a = $(this);
		var file = $a.attr('rel');
		
		$a.click(function() {
		
			$.ajax({
				type: 'POST',
				data: 'file=' + file,
				url: 'downloads.php',
				success: function() {}
			});	
		
		});
	
	
	});

});

Qui ovviamente potete utilizzare anche il metodo $.post(). Ho usato il metodo più generale semplicemente a scopo illustrativo. Notate come l'azione predefinita del link non deve essere compromessa. In questo caso AJAX lavora in background.