diff --git a/data/interfaces/default/logs.html b/data/interfaces/default/logs.html
index 022be43e..84bdc1f9 100644
--- a/data/interfaces/default/logs.html
+++ b/data/interfaces/default/logs.html
@@ -16,21 +16,6 @@ lossless<%inherit file="base.html"/>
 			</tr>
 		</thead>
 		<tbody>
-		%for line in lineList:
-			<%
-				timestamp, message, level, threadname = line
-				
-				if level == 'WARNING' or level == 'ERROR':
-					grade = 'X'
-				else:
-					grade = 'Z'
-			%>
-				<tr class="grade${grade}">
-					<td id="timestamp">${timestamp}</td>
-					<td id="level">${level}</td>
-					<td id="message">${message}</td>
-				</tr>
-		%endfor
 		</tbody>
 	</table>
 </%def>
@@ -42,22 +27,39 @@ lossless<%inherit file="base.html"/>
 <%def name="javascriptIncludes()">
 	<script src="js/libs/jquery.dataTables.min.js"></script>
 	<script>
-	$(document).ready(function()
-	{
-		$('#log_table').dataTable(
-			{
-				"oLanguage": {
+$(document).ready(function() {
+	$('#log_table').dataTable( {
+		"bProcessing": true,
+        "bServerSide": true,
+		"sAjaxSource": 'getLog',
+        "sPaginationType": "full_numbers",
+        "bStateSave": true,
+        "oLanguage": {
 					"sLengthMenu":"Show _MENU_ lines per page",
 					"sEmptyTable": "No log information available",
 					"sInfo":"Showing _START_ to _END_ of _TOTAL_ lines",
 					"sInfoEmpty":"Showing 0 to 0 of 0 lines",
 					"sInfoFiltered":"(filtered from _MAX_ total lines)"},
-				"bStateSave": true,
-				"iDisplayLength": 100,
-				"sPaginationType": "full_numbers",
-				"aaSorting": []
-
-			});
-	});
+        "fnRowCallback": function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
+                                if (aData[1] === "WARNING" || aData[1] === "ERROR")
+                                {
+                                    $('td', nRow).closest('tr').addClass("gradeX");
+                                }
+                                else
+                                {
+                                    $('td', nRow).closest('tr').addClass("gradeZ");
+                                }
+                                
+                                
+                                return nRow;
+                                },
+        "fnServerData": function ( sSource, aoData, fnCallback ) {
+			/* Add some extra data to the sender */
+			$.getJSON( sSource, aoData, function (json) { 
+				fnCallback(json)
+			} );
+		}
+	} );
+} );
 	</script>
 </%def>
\ No newline at end of file
diff --git a/headphones/webserve.py b/headphones/webserve.py
index 799d84f3..59718b9e 100644
--- a/headphones/webserve.py
+++ b/headphones/webserve.py
@@ -394,6 +394,38 @@ class WebInterface(object):
         return serve_template(templatename="logs.html", title="Log", lineList=headphones.LOG_LIST)
     logs.exposed = True
     
+
+    def getLog(self,iDisplayStart=0,iDisplayLength=100,iSortCol_0=0,iSortCol_1=0,iSortCol_2=0,
+        sSortDir_0="desc",sSortDir_1="desc",sSortDir_2="desc",
+        sSearch="",**kwargs):
+
+        iDisplayStart = int(iDisplayStart)
+        iDisplayLength = int(iDisplayLength)
+
+        filtered = []
+        if sSearch == "":
+            filtered = headphones.LOG_LIST[::]
+        else:
+            filtered = [row for row in headphones.LOG_LIST for column in row if sSearch in column]
+
+        sortcolumn = 0
+        if iSortCol_0 == '1':
+            sortcolumn = 2
+        elif iSortCol_0 == '2':
+            sortcolumn = 1
+        filtered.sort(key=lambda x:x[sortcolumn],reverse=sSortDir_0 == "desc")        
+
+        rows = filtered[iDisplayStart:(iDisplayStart+iDisplayLength)]
+        rows = [[row[0],row[2],row[1]] for row in rows]
+
+        dict = {'iTotalDisplayRecords':len(filtered),
+                'iTotalRecords':len(headphones.LOG_LIST),
+                'aaData':rows,
+                }
+        s = simplejson.dumps(dict)
+        return s
+    getLog.exposed = True
+
     def clearhistory(self, type=None):
         myDB = db.DBConnection()
         if type == 'all':