How to implement datatables in asp.net mvc?

SO I have an entity called product as follow:

public class Product
    {
        [HiddenInput(DisplayValue=false)]
        public int ProductID { get; set; }
        public string ProductName { get; set; }
        [DataType(DataType.MultilineText)]
        public string ProductDescription { get; set; }
        public decimal ProductPrice { get; set; }
        public string Category { get; set; }
        public string SubCategory { get; set; }
    }

I have another class called EFProductRepository which is derived from another class called IProductRepository as following:

public class EFProductRepository : IProductRepository
    {
        private EFDbContext context = new EFDbContext();
        public IEnumerable<Product> Products
        {
            get { return context.Products; }
        }
    }

Then in my controller action Index i have this:

public ViewResult Index()
        {
            return View(repository.Products);
        }

and a view for index which list the data in a table, SO the question is how can i implement the DataTable client side to this piece of code? i tried this here jQuery Datatable with MVC 5 and Entity Framework but no luck unfortunately. Any help is appreciated, Regards.