diff --git a/airtime_mvc/application/services/HistoryService.php b/airtime_mvc/application/services/HistoryService.php
index a7587d2d3..003ef41a8 100644
--- a/airtime_mvc/application/services/HistoryService.php
+++ b/airtime_mvc/application/services/HistoryService.php
@@ -174,20 +174,6 @@ class Application_Service_HistoryService
 			" LEFT JOIN {$filter} USING(history_id)";
 		}
 
-		//----------------------------------------------------------------------
-		//need to count the total rows to tell Datatables.
-		$stmt = $this->con->prepare($mainSqlQuery);
-		foreach ($paramMap as $param => $v) {
-			$stmt->bindValue($param, $v);
-		}
-
-		if ($stmt->execute()) {
-			$totalRows = $stmt->rowCount();
-		}
-		else {
-			$msg = implode(',', $stmt->errorInfo());
-			throw new Exception("Error: $msg");
-		}
 
 		//-----------------------------------------------------------------------
 		//Using the instance_id to filter the data.
@@ -199,6 +185,21 @@ class Application_Service_HistoryService
 
 		    $paramMap["instance"] = $instanceId;
 		}
+		
+		//----------------------------------------------------------------------
+		//need to count the total rows to tell Datatables.
+		$stmt = $this->con->prepare($mainSqlQuery);
+		foreach ($paramMap as $param => $v) {
+			$stmt->bindValue($param, $v);
+		}
+		
+		if ($stmt->execute()) {
+			$totalRows = $stmt->rowCount();
+		}
+		else {
+			$msg = implode(',', $stmt->errorInfo());
+			throw new Exception("Error: $msg");
+		}
 
 		//------------------------------------------------------------------------
 		//Using Datatables parameters to sort the data.
diff --git a/airtime_mvc/public/js/airtime/playouthistory/historytable.js b/airtime_mvc/public/js/airtime/playouthistory/historytable.js
index 9d9a7c750..5baeb3f26 100644
--- a/airtime_mvc/public/js/airtime/playouthistory/historytable.js
+++ b/airtime_mvc/public/js/airtime/playouthistory/historytable.js
@@ -53,7 +53,11 @@ var AIRTIME = (function(AIRTIME) {
     var dateStartId = "#his_date_start",
 		timeStartId = "#his_time_start",
 		dateEndId = "#his_date_end",
-		timeEndId = "#his_time_end";
+		timeEndId = "#his_time_end",
+    
+		oTableAgg,
+		oTableItem,
+		oTableShow;
     
     function getSelectedLogItems() {
     	var items = Object.keys(selectedLogItems);
@@ -168,24 +172,23 @@ var AIRTIME = (function(AIRTIME) {
         } );
     }
     
-  //config: name, type, filemd, required
     function createShowAccordSection(config) {
     	var template,
     		$el;
     	
     	template = 
-    		"<h3 " +
-    	      "data-instance='<%= instance %>' " +
-		      "data-starts='<%= starts %>' " +
-		      "data-ends='<%= ends %>'" +
-    	    ">" +
+    		"<h3>" +
     	      "<a href='#'>" +
     	        "<span><%= name %></span>" +
   			    "<span><%= starts %></span>" +
   			    "<span><%= ends %></span>" +
     	      "</a>" +
     	    "</h3>" +
-    	 "<div>First content panel</div>";
+    	 "<div " +
+    	    "data-instance='<%= instance %>' " +
+	        "data-starts='<%= starts %>' " +
+	        "data-ends='<%= ends %>'" +
+    	 "></div>";
     	
     	template = _.template(template);
     	$el = $(template(config));
@@ -196,7 +199,19 @@ var AIRTIME = (function(AIRTIME) {
     //$el is the div in the accordian we should create the table on.
     function createShowTable($el) {
     	
-    	oTableShow = itemHistoryTable("history_table_list");
+    	var instance = $el.data("instance");
+    	var $table = $("<table/>", {
+			'cellpadding': "0", 
+			'cellspacing': "0", 
+			'class': "datatable",
+			'id': "history_table_show"
+		});
+    	
+    	//assign the retrieval function the show instance id.
+    	fnServerData.instance = instance;
+    	$el.append($table);
+    	$el.css("height", "auto");
+    	oTableShow = itemHistoryTable("history_table_show");
     }
     
     function drawShowList(oShows) {
@@ -224,20 +239,18 @@ var AIRTIME = (function(AIRTIME) {
     	$showList.accordion({
     		create: function( event, ui ) {
     			var $div = $showList.find(".ui-accordion-content-active");
+    			createShowTable($div);
     		},
 		    change: function( event, ui ) {
-		    	var x;
+		    	var $div = $(ui.newContent);
+		    	createShowTable($div);
 		    },
 		    changestart: function( event, ui ) {
-		    	var x;
+		    	$(ui.oldContent).empty();
 		    }
 		});
     }
     
-    function drawShowTable() {
-    	
-    }
-    
     function createToolbarButtons ($el) {
         var $menu = $("<div class='btn-toolbar' />");
         
@@ -399,9 +412,6 @@ var AIRTIME = (function(AIRTIME) {
     	
     	var oBaseDatePickerSettings,
     		oBaseTimePickerSettings,
-    		oTableAgg,
-    		oTableItem,
-    		oTableShow,
     		$hisDialogEl,
     		
     		tabsInit = [
@@ -409,18 +419,27 @@ var AIRTIME = (function(AIRTIME) {
     		    	initialized: false,
     		    	initialize: function() {
     		    		oTableItem = itemHistoryTable("history_table_list");
+    		    	},
+    		    	navigate: function() {
+    		    		delete fnServerData.instance;
     		    	}
     		    },
     		    {
     		    	initialized: false,
     		    	initialize: function() {
     		    		oTableAgg = aggregateHistoryTable();
+    		    	},
+    		    	navigate: function() {
+    		    		delete fnServerData.instance;
     		    	}
     		    },
     		    {
     		    	initialized: false,
     		    	initialize: function() {
     		    		showSummaryList();
+    		    	},
+    		    	navigate: function() {
+    		    		showSummaryList();
     		    	}
     		    }
     		];
@@ -617,6 +636,9 @@ var AIRTIME = (function(AIRTIME) {
 					tab.initialize();
 					tab.initialized = true;
 				}
+				else {
+					tab.navigate();
+				}
 			}
     	});