DataTables logo
≡

Anti-span / Anti-bot validation

Integration with Turnstile to help validate that it is humans who are submitting data.

This plug-in makes use of Cloudflare Turnstile to provide anti-bot and anti-spam verification (similar to a captcha, but more user friendly).

The client-side aspect is provided by this plug-in. You'll also need a server-side verification for the token that is submitted as the value for this field. See this blog post for how to integrate with the Editor server-side libraries.

You'll also need a Turnstile site key and secret key, which you can obtain free from Cloudflare. See their documentation here.

Use

This plug-in can be obtained and used in multiple different ways.

Browser

This plug-in is available on the DataTables CDN:

JS

The plug-in will then automatically register itself against a global DataTables instance. This file can also be used if you are using an AMD loader such as Require.js.

Note that if you are using multiple plug-ins, it can be beneficial in terms of performance to combine the plug-ins into a single file and host it on your own server, rather than making multiple requests to the DataTables CDN.

NPM

The plug-ins are all available on NPM (which can also be used with Yarn or any other Javascript package manager) as part of the datatables.net-plugins package. To use this plug-in, first install the plug-ins package:

npm install datatables.net-plugins

Then import datatables.net, any other DataTables extensions you need, plus the plug-in:

import DataTable from 'datatables.net';
import 'datatables.net-plugins/editorFields/editor.turnstile.mjs';

Example

const editor = new DataTable.Editor({
  table: '#myTable',
  fields: [
    {
      label: 'Verify:',
      name: 'turnstile',
      type: 'turnstile',
      siteKey: '...my-site-key...'
    }
  ]
});

Version control

If you have any ideas for how this plug-in can be improved, or spot anything that is in error, it is available on GitHub and pull requests are very welcome!