DataTables.Blazor 3.6.1

.NET 6.0 .NET Standard 2.1 
dotnet add package DataTables.Blazor --version 3.6.1
NuGet\Install-Package DataTables.Blazor -Version 3.6.1
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package. 
<PackageReference Include="DataTables.Blazor" Version="3.6.1" />
For projects that support PackageReference, copy this XML node into the project file to reference the package. 
paket add DataTables.Blazor --version 3.6.1
#r "nuget: DataTables.Blazor, 3.6.1"
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package. 
// Install DataTables.Blazor as a Cake Addin
#addin nuget:?package=DataTables.Blazor&version=3.6.1

// Install DataTables.Blazor as a Cake Tool
#tool nuget:?package=DataTables.Blazor&version=3.6.1

DataTables.Blazor

A basic port for jquery DataTables into Blazor.

About:

This was written purely for fun, if you'd like to use it you're welcome to do so, it's under an MIT License. If you've found it useful, and want to say thanks, feel free to buy me a coffee, otherwise enjoy.
"Buy Me A Coffee"

Disclaimer.
  • This project is still pretty immature, and needs a lot of work and is liable to be buggy.
  • Its functionality may not yet fully replicate all the options available in DataTables.
  • However, DataTables comes with a lot of great features out of the box which can be easily utilised straight away.
Setup:
Prerequisites:

You will need to include jquery Datatables in your project, some of the options are not available to older versions so to be on the safe side, v1.10.24 would be best. Steps to complete can be found here.

Configuration:

Below are the steps required to configure the package in a client-side Blazor WebAssembly app.

  • Install the DataTables.Blazor package using your preferred method.
  • Add the following using statement to the top of your Program.cs:
using DataTables.Blazor.Extensions;
  • Then add the following line to add the necessary services to your Program.cs.
builder.Services.AddDataTables();
  • Add the following line to your index.html, below where you include DataTables.
<script src="_content/DataTables.Blazor/datatables.blazor.min.js"></script>
  • Finally, add the following statement to your _Imports.razor
@using DataTables.Blazor

You should now be ready to get started with DataTables.Blazor!

Usage:
  • At the moment there are two basic components, DataTable and DataTableColumn.
  • DataTableColumn components should be nested inside the DataTable component.
  • This is then transformed into a jquery DataTable configured with the DataTable defaults. As is shown in the demo, adding a datatable is then as easy as adding the below to your page/component.
<DataTable SourceUrl="sample-data/weather.json" Class="table table-striped table-bordered w-100">
    <DataTableColumn Title="Date" Data="Date" />
    <DataTableColumn Title="Temp. (C)" Data="TemperatureC" />
    <DataTableColumn Title="Summary" ClassName="dt-body-center" Data="Summary" />
</DataTable>
  • There is also an Options parameter on the DataTable which can expose more advanced configuration options.

Code

DataTables.Blazor

A Razor class library that brings the functionality of jquery Datatables into Blazor.

DataTables.Blazor.Demo

A client-side Blazor WebAssembly application to demo the package.

DataTables.Blazor.Tests

Xunit/Bunit tests for the DataTables.Blazor project.

Release Notes:

3.6.0

  • Adds .NET 8 support.

3.2.0

  • Add reload and reinitialize methods as well as AutoReload for the DataTable component.

3.1.0

  • Add support for datatables Button extension.

3.0.0

  • Rename Column component to DataTableColumn to reduce risk of naming clash.

2.1.0

  • Added Data attribute to DataTable and Dataset<T> to allow specifying a C# object as a data source.

2.0.0

  • Update packages for .NET 5 and add .NET 6 target.

1.0.0

  • Add JavaScriptFunction to allow JS callbacks to be set where available in jQuery datatables.

0.x.x

  • Early implementations with little functionality.
Product Compatible and additional computed target framework versions.
.NET net5.0 was computed.  net5.0-windows was computed.  net6.0 is compatible.  net6.0-android was computed.  net6.0-ios was computed.  net6.0-maccatalyst was computed.  net6.0-macos was computed.  net6.0-tvos was computed.  net6.0-windows was computed.  net7.0 is compatible.  net7.0-android was computed.  net7.0-ios was computed.  net7.0-maccatalyst was computed.  net7.0-macos was computed.  net7.0-tvos was computed.  net7.0-windows was computed.  net8.0 is compatible.  net8.0-android was computed.  net8.0-browser was computed.  net8.0-ios was computed.  net8.0-maccatalyst was computed.  net8.0-macos was computed.  net8.0-tvos was computed.  net8.0-windows was computed. 
.NET Core netcoreapp3.0 was computed.  netcoreapp3.1 was computed. 
.NET Standard netstandard2.1 is compatible. 
MonoAndroid monoandroid was computed. 
MonoMac monomac was computed. 
MonoTouch monotouch was computed. 
Tizen tizen60 was computed. 
Xamarin.iOS xamarinios was computed. 
Xamarin.Mac xamarinmac was computed. 
Xamarin.TVOS xamarintvos was computed. 
Xamarin.WatchOS xamarinwatchos was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last updated
3.6.1 1,262 1/10/2024
3.5.0 2,375 5/7/2023
3.4.0 2,501 12/30/2022
3.3.0 1,909 8/8/2022
3.2.0 460 7/14/2022
3.1.0 791 6/18/2022
3.0.0 1,820 1/22/2022
2.1.0 432 1/19/2022
2.0.0 278 12/29/2021
1.0.0 725 5/9/2021
0.1.3 373 4/25/2021
0.1.2 295 4/25/2021
0.1.1 645 7/17/2020
0.1.0 389 7/17/2020

Basic support for JavaScript function callbacks.