$(document).ready( function() { 
	$.ajaxSetup ({ async: true });
	
	//Loading icon
	var ajax_load = '<img src="path/to/images/ajax-loader.gif" alt="loading..." />';

	var dataColsArray = new Array();
	var numRows = 0;
	$("#resultCount").html(numRows + " results");
	
	$(".ajax").click(function(){  
		var pageDisplayLimit = 10;
		var dataColsArray = new Array();
		var classAttrs = $(this).attr('class');
		var tagNames = classAttrs.split(" ");
		var tagName;
		
		$(tagNames).each(function()
		{
			if(this.indexOf('-') >= 0)
			{
				//If button class has "-" in it, split it. We use the parts to determine where 
				//to display the results
				//Exmaple: <button type="submit" class="submitBtn ajax target-searchResultsTable">Find</button>
				var splitClass = this.split('-');
				tagName = splitClass[1];
			}
		});
		
		//The table should have the columns defined ahead of time, use that
		//to generate the list of values we need from the JSON response.
		var columnNames = "#" + tagName + " thead th";
		$(columnNames).each( function() { 
			dataColsArray.push( $(this).attr("id") );
		});
	
		//While request and parsing is taking place, put loading messages in place
		$("#resultCount-"+tagName).html("Searching...");
		
		if ( $("#" + tagName + " tbody"))  $("#" + tagName + " tbody").remove();
		$("#" + tagName + " thead").after("<tbody><td colspan=\""+dataColsArray.length+"\" align=\"center\">"+ajax_load+"</td></tbody>");  
		
		//Make the JSON request and parse the response
		$.getJSON(  
			jsonUrl,  
			jsonParameters,
			function(json) {  
				var output = "<tbody>";
				
				numRows = $(json.results).length;
				if ($(json.results)) {
					$(json.results).each( function() { 
						output += '<tr>';
						for (col in dataColsArray) 
						{
							//TODneed to add code to support targeting linked column
							if (col == 0) 
								output += '<td><a href="#">'+eval("this."+dataColsArray[col])+'</a></td>';
							else
								output += '<td>'+eval("this."+dataColsArray[col])+'</td>';
							
						}
						output += '</tr>';
					});
				}
				
				output += '</tbody>';
				
				$("#" + tagName + " tbody").remove();  
				$("#" + tagName + " thead").after(output);
				$("#" + tagName + " tr:even").addClass("even");
				$("#" + tagName + " tr:odd").addClass("odd");
				
				//If the items returned is less than the display limit, show that number
				//otherwise, display the limit.
				var displayCount = (numRows < 10 ? numRows : pageDisplayLimit);
				$("#resultCount-"+tagName).html(numRows + " results (displaying 1-"+displayCount+")");
		});  
	});  
});