Today, we are excited to announce version 2.1.0 (up from 2.0.0) of our jQuery SDK. Here are the new features:

A new progressbar design

We haven't changed the design of the progressbar for the past 4 years and it began to look quite a bit dated. Therefore, we set out to improve its looks with the help of the design of Twitter Bootstrap.

Here are the before and after pictures. We think this is a big improvement.

Before:

After:

Set Encoding Instructions in the browser

Until now, you would have to use the hidden input field named params to inject your Assembly Instructions into the plugin. That is far from ideal. People have always had trouble getting the JSON encoding and HTML entity escaping right.

There is no need for that anymore. You can now directly specify Assembly Instructions on the plugin, by using its new params parameter. Here is an example:

$('#MyForm').transloadit({
  wait: true,
  params: {
    auth: { key: 'YOUR_TRANSLOADIT_KEY' },
    steps: {
      resize_to_75: {
        robot: '/image/resize',
        use: ':original',
        width: 75,
        height: 75,
      },
      // more Steps here
    },
  },
})

You could also provide the signature in a signature parameter directly to the plugin. Just make sure to calculate in the back-end, so that your Transloadit Auth Secret is not exposed in your public JavaScript code.

The triggerUploadOnFileSelection option

As the name implies, this option - when set to true - triggers the upload to Transloadit as soon as the user has selected a file in any of the form's file input fields. This is false by default.

Show an error if the user selected a wrong file type

You can use the HTML5's "accept" attribute on file input fields to limit the files that can be selected by file extension. However, this can be bypassed by users pretty easily. The plugin now has a mechanism to spot this and display an error regardless. Cheaper than having to use our /file/filter Robot, even though that obviously still provides the best security.

The fields parameter can now send an object of key/value pairs

The fields parameter is responsible for selecting the form fields that should also be submitted to Transloadit to be made available in ${fields.*} Assembly variables.

It can now also accept an object of key/value pairs, if you do not want to rely on hidden form fields at all:

$('#MyForm').transloadit({
  wait: true,
  fields: {
    name: 'John Doe',
    age: 26,
  },
})

Available versions

Here are all the available jQuery SDK versions again:

Latest

This is always the overall latest version, and for now points to v2.1.0. Once 3.0.0 ships, this will most likely have backwards compatibility issues. That is why "Version 2 Latest" is recommended.

https://assets.transloadit.com/js/jquery.transloadit2-latest.js

Version 2 latest

This is always the latest version of version 2, and for now points to v2.1.0. This is the recommended version to use:

https://assets.transloadit.com/js/jquery.transloadit2-v2-latest.js

v2.1.0

This is the current version, with a new progress bar design and new features. Supports jQuery 1.9+ but not IE6:

https://assets.transloadit.com/js/jquery.transloadit2-v2.1.0.js

v2.0.0

Has the old progressbar design and doesn't have the new features. Supports jQuery 1.9+ but not IE6:

https://assets.transloadit.com/js/jquery.transloadit2-v2.0.0.js

v1.0.0

Has the old progressbar design. Supports IE6, but not jQuery 1.9+:

https://assets.transloadit.com/js/jquery.transloadit2-v1.0.0.js

We have a lot more stuff in store for our jQuery SDK (like Drag and Drop uploads), so please stay tuned! And as always, feature requests are more than welcome.