Installing

One of the best ways of getting started with a new software library is to jump right into the examples provided and start playing with the options each example presents. This lets you directly see the effect of each option on the pre-built examples, providing solid groundwork for when you start creating editable tables yourself.

Editor has a number of examples that are included in the .NET and PHP download packages so you can manipulate the examples to your heart's content!

Download the package

To get started, you need to download the Editor software so you can run it from your server. The latest version of Editor can always be downloaded from the Editor download page.

There are four packages that are available:

For full instructions on how to install the server-side component of each package, please refer to the documentation links above. The instructions are different for each platform.

Javascript and CSS includes

To use Editor the following files need to be included:

  • jQuery (Javascript only)
  • DataTables (Javascript and CSS)
  • Editor (Javascript and CSS).

Optionally you can also select to install

  • Buttons (Javascript and CSS)
  • Select (Javascript and CSS)
    • Buttons and Select are often used in combination with Editor to provide buttons for control of the editing form and row selection options. The examples on this site generally will use both, although they are optional.

The easiest way to ensure that we include all of the required software is to use the DataTables downloader. This interface will provide a single URL to include all of the required software from the DataTables CDN, with the exception of Editor which must be included locally.

CDN

The DataTables CDN provides a convenient way to load files that are already hosted on the internet and includes all of our open source software. Editor needs to be hosted locally due to its commercial nature, so the HTML to include the required CSS and Javascript will look like this:

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jqc-1.12.4/dt-1.10.19/b-1.5.6/sl-1.3.0/datatables.min.css"/>
<link rel="stylesheet" type="text/css" href="Editor-1.9.0/css/editor.dataTables.css">

<script type="text/javascript" src="https://cdn.datatables.net/v/dt/jqc-1.12.4/dt-1.10.19/b-1.5.6/sl-1.3.0/datatables.min.js"></script>
<script type="text/javascript" src="Editor-1.9.0/js/dataTables.editor.js"></script>

Download

You may also wish to download the software to host all of it on your own servers. This can be achieved through the DataTables download builder. Select the software you wish to include in the download, including Editor, and then select the download option. Install the downloaded files onto your web-server and your includes for the software would then look similar to:

<link rel="stylesheet" type="text/css" href="DataTables/datatables.min.css"/>
<script type="text/javascript" src="DataTables/datatables.min.js"></script>

npm

The Editor client-side software is not currently directly available on npm, but we do provide a wrapper module for it, which will take the downloaded Editor file's and install them into the node packages as if it were any other package. The wrapper module is called datatables.net-editor

npm install datatables.net-editor

When the package has been installed it will show a message indicating how to complete the installation with the licensed version of Editor. Essentially you need to download an Editor package and then run a script so it can be extracted and made available in the node modules.

For more information on installing DataTables and the other extensions using npm, please refer to the DataTables npm documentation.

CommonJS

To include Editor in a CommonJS environment, you can use:

var $       = require( 'jquery' );
var dt      = require( 'datatables.net' )();
var editor  = require( 'datatables.net-editor' )();

Note the function call - the CommonJS loader for DataTables, Editor and the other extensions provide the ability to pass in a window object and an already existing jQuery object - e.g.:

var $       = require( 'jquery' );
var dt      = require( 'datatables.net' )(window, $);
var editor  = require( 'datatables.net-editor' )(window, $);

AMD

In an AMD environment such as RequireJS, DataTables, Editor and the other extensions will automatically include their required components - e.g.:

require( ['jquery', 'datatables.net', 'datatables.net-editor'], function ($) {
  $('#myTable').DataTable();
} );