Jquery – How to use JQuery Datatable.net with ASP.Net 4 Razor and Twitter Bootstrap


I want to use the jQuery Datatable with ASP.net MVC and Twitter bootstrap.

Does anyone have already done this ?

Best Solution

This may be an old post but I just wanted to add how I got things set up. It seems to be easier than how codea did it above.

1) In your view, simply create your table like normal (with a @foreach or some such thing) and give it an ID of jqueryTable. Then download the following 3 files and put them in the ~/Scripts/ and the ~/Content/ folders:




Now add those files to your BundleConfig.cs file using the following code:

bundles.Add(new ScriptBundle("~/Scripts/datatables").Include(

bundles.Add(new StyleBundle("~/Content/datatables").Include(

Finally, add the following to the view where you created your table (note that the JS file order matters!):


@section Scripts {

    <script type="text/javascript" language="javascript">

        /* Table initialization */
        $(document).ready(function() {


The JS code above simply finds your table (with an ID of jqueryTable) and initializes the datatables JS on it. Also, for this to work, the ~/bundles/jquery will need to be included in your _Layout.cshtml file (which it should be by default).