Thursday 12th February, 2015

Editor 1.4 / DataTables 1.10.5

I'm delighted to use my first blog post of 2015 to announce the releases of Editor 1.4 and DataTables 1.10.5. 2015 is going to be an exciting year for the DataTables project with a lot of useful additions to the project planned, and these two new releases set the tone nicely.

In this post I will give a run down of some of the major new features in each release - in future posts will explore some of these features in more detail.

Both Editor 1.4 and DataTables 1.10.5 are available immediately:

Editor 1.4

The fifth major release of Editor sees support for the .NET platform added. Since the original release of Editor, it has been provided with PHP libraries to make CRUD operations as easy as possible. This decision to focus on PHP initially was a fairly easy one to maximise the reach of Editor in the marketplace. However, the goal has always been to extend beyond just PHP and now that goal has been realised with the introduction of .NET libraries for DataTables and Editor.

This release has focused primarily on the development of the .NET libraries, but the Javascript and PHP components have also seen new features introduced and all known bugs addressed.

Also as part of the 1.4 release the packaging and installation of Editor has been simplified. There are now three packages and any external resources are requested from a CDN rather than needing a specific path structure to be set-up:

Editor for PHP - Includes the PHP libraries and all examples
Editor for .NET - Includes the .NET libraries and all examples
Editor JS+CSS only - Just the client-side software!

Editor 1.4 is a free upgrade for all current license holders.

.NET

The .NET libraries for Editor provide the same functionality as the PHP libraries, with a very similar API (although each slightly different to conform to best practices for each platform). As Editor development progresses the two libraries will be developed side-by-side and retain feature compatibility.

Extensive documentation for using Editor with .NET has been developed. The focus in the examples and documentation is largely on using Web API with Editor's Ajax calls, as Web API is a perfect match for a use case such as Editor, but you can also use a more traditional MVC controller to respond to Ajax requests if needed.

The Editor .NET package is a Visual Studio project that will get you up and running with Editor super quickly. Just download the package, configure it to access your database and install the Editor demo SQL on your database! Full installation instructions are available.

Generator

Editor's Generator has been updated to produce either a PHP package or Visual Studio package, depending on your platform of choice, making it super easy to get started on either platform. Simply enter the fields you want and Generator will create everything you need for the client-side and server-side.

The SQL created by Generator currently supports SQL Server / Azure, MySQL and Postgres databases. Additional databases such as Oracle and SQLite will be added in future.

Dependent method

On the client-side Editor's new dependent() method provides the ability to easily update the form conditionally based on user input values. Consider for example the common case of wanting to display an additional option when a particular select input or radio box value is selected - dependent() now makes this trivial.

In the example below when the value of the field location is set to "Other" the field "external_location" will be shown - otherwise it will be hidden:

editor.dependent( 'location', function ( val, data, callback ) {
    return val === 'other' ?
        { show: 'external_location' } :
        { hide: 'external_location' };
} );

dependent() can control field visibility, options and values all through use of the returned data. Additionally it can obtain that control data using a local callback, as above, or externally using an Ajax request.

With dependent() complex forms can be created as quickly as simple ones!

Other features

There are other new features such as the ability to use complex conditions and sub-queries in the Editor class as well as fine grained control of server-side get and set values for the libraries. These topics can get fairly complex so I will explore them in future posts!

DataTables 1.10.5

This latest release of DataTables is primarily a bug fix release, although it does introduce the new feature of being able to configure a DataTable using HTML data-* attributes. When a DataTable is constructed it will now read the data-* properties from the table tag and use these as initialisation options. This ability is a commonly asked for feature and something I've wanted to add for a long time - many thanks to greenbender for suggesting a really simple way of implementing this!

Using the data-* attributes as initialisation options is quite simple, you just need to keep two rules in mind:

Attribute dashed names will be converted to camelCase automatically. For example the pageLength option would be written as the attribute data-page-length.
If an object or array value is required as the value it must be valid JSON. This means that double quotes must be used inside the attribute and therefore single quotes used for the attribute itself (this is how jQuery implements its $().data() method which is used for this feature).

Not only can table level configuration properties can be applied to the table tag, but also column options can be applied using attributes on the header cells for each column.

Consider for example the following HTML:

<table data-order='[[ 1, "asc" ]]' data-page-length='25'>
    <thead>
        <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th data-class-name="priority">Salary</th>
        </tr>
    </thead>
</table>

That is functionally the same as using the following Javascript:

$('table').DataTable( {
    order: [[ 1, "asc" ]],
    pageLength: 25,
    columnDefs: [ {
        targets: -1,
        className: "priority"
    } ]
} );

This method of configuring options will take priority over Javascript configured parameters (allowing the Javascript configuration to be global for the page, while this is table specific). Additionally the initialisation documentation has been updated to reflect this new option.

Download

DataTables 1.10.5 is available on the DataTables CDN and can also be downloaded for local hosting from the downloads page.

For a full run down of the new features and bug fixes present in 1.10.5 please refer to the release notes.

Enjoy!

It is always a pleasure to develop DataTables and Editor and I'm very excited about these latest releases. If you encounter any issues or have any questions about them, please open a new thread in the forums. Equally, if you just want to share how you are using them, please let us know!