ASP.NET MVC: DataTables w/AJAX example

EventsController.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace Quantech_mda.mil.Controllers
{
    [Authorize(Roles = "SuperUser")]
    public class EventsController : BaseController
    {
        public ActionResult Index()
        {
            return View();
        }

        [HttpPost]
        public ActionResult Index(int sEcho, int iDisplayStart, int iDisplayLength)
        {
            if (Request.IsAjaxRequest())
            {
                var events = LoggingService.GetEvents(iDisplayStart / iDisplayLength + 1, iDisplayLength);

                var result = new
                {
                    sEcho = sEcho,
                    iTotalRecords = events.TotalItems,
                    iTotalDisplayRecords = events.TotalItems,
                    aaData = events.Items.Select(e => new string[] { e.EventTime.ToLongDateString(), e.UserName, e.EventType, e.ModifiedObject })
                };

                return Json(result);
            }

            return new EmptyResult();
        }
    }
}

Index.cshtml

@model PetaPoco.Page<Quantech_mda.mil.Models.SystemEvent>
@{
    ViewBag.Title = "Events";
}
@section pagetitle
{
    <h1>@ViewBag.Title</h1>
}
<ul class="breadcrumbs">
	<li><a href="/">Home</a></li>
	<li>Events</li>
</ul>
<table id="events" class="table">
    <thead>
        <tr>
            <th>
                Date/Time
            </th>
            <th>
                User
            </th>
            <th>
                Event Type
            </th>
            <th>
                Modified Object
            </th>
        </tr>
    </thead>
    <tbody>
        @if (Model != null)
        {
            foreach (var systemEvent in Model.Items)
            {
            <tr>
                <td>@systemEvent.EventTime
                </td>
                <td>@systemEvent.UserName
                </td>
                <td>@systemEvent.EventType
                </td>
                <td>@systemEvent.ModifiedObject
                </td>
            </tr>
            }
        }
    </tbody>
</table>
@section scripts
{
    <script type="text/javascript" src="@Url.Content("~/Scripts/DataTables-1.9.4/media/js/jquery.dataTables.min.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.dataTables.paging.bootstrap.js")"></script>
    <script type="text/javascript">
        (function ($) {
            $(function () {
                $.extend($.fn.dataTableExt.oStdClasses, {
                    "sWrapper": "dataTables_wrapper form-inline"
                });

                $("#events").dataTable({
                    "bServerSide": true,
                    "bFilter": false,
                    "aLengthMenu": [[25, 50, 100], [25, 50, 100]],
                    "iDisplayLength": 25,
                    "sAjaxSource": '@Url.Action("Index")',
                    "fnServerData": function (sSource, aoData, fnCallback) {
                        $.ajax({
                            "dataType": 'json',
                            "type": "POST",
                            "url": sSource,
                            "data": aoData,
                            "success": fnCallback
                        });
                    },
                    "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
                    "sPaginationType": "bootstrap",
                    "aoColumns": [
                        { "sName": "EventTime", "sType": 'datetime' },
                        { "sName": "UserName" },
                        { "sName": "EventType" },
                        { "sName": "ModifiedObject" }
                    ]
                });
            });
        })(jQuery);
    </script>
}