Last updated: November 29, 2024

<span aria-hidden="true" id="new-jquery-sdk-version-210-released"></span>

# New jQuery SDK version 2.1.0 released!

![Tim Koschützki](/assets/images/teammates/avatar-tim-kos-1.jpg?dpl=dpl_6nhQNS5wkVkPZWuKMzXcWrAHNJL5)

**Tim Koschützki**

Co-founder · Berlin, Germany · Show bio

[](https://x.com/tim%5Fkos)[](https://github.com/tim-kos)

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

<span aria-hidden="true" id="a-new-progressbar-design"></span>

### 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⁠](https://getbootstrap.com/).

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

Before:

After:

<span aria-hidden="true" id="set-encoding-instructions-in-the-browser"></span>

### 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:

```javascript
$('#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.

<span aria-hidden="true" id="the-triggeruploadonfileselection-option"></span>

### 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.

<span aria-hidden="true" id="show-an-error-if-the-user-selected-a-wrong-file-type"></span>

### 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](/docs/robots/file-filter.md) Robot, even though that obviously still provides the best security.

<span aria-hidden="true" id="the-fields-parameter-can-now-send-an-object-of-keyvalue-pairs"></span>

### 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:

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

```

<span aria-hidden="true" id="available-versions"></span>

### Available versions

Here are all the available jQuery SDK versions again:

<span aria-hidden="true" id="latest"></span>

#### 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⁠](https://assets.transloadit.com/js/jquery.transloadit2-latest.js)

<span aria-hidden="true" id="version-2-latest"></span>

#### 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⁠](https://assets.transloadit.com/js/jquery.transloadit2-v2-latest.js)

<span aria-hidden="true" id="v210"></span>

#### 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⁠](https://assets.transloadit.com/js/jquery.transloadit2-v2.1.0.js)

<span aria-hidden="true" id="v200"></span>

#### 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⁠](https://assets.transloadit.com/js/jquery.transloadit2-v2.0.0.js)

<span aria-hidden="true" id="v100"></span>

#### 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⁠](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.

[#integrations](/blog/tags/integrations.md)[#jquery-sdk](/blog/tags/jquery-sdk.md)[#file-filter-robot](/blog/tags/file-filter-robot.md)

### 👩‍💻 Join 20k+ developers

Sign up for our [monthly newsletter](/newsletters.md) to receive direct links to 3 exclusive tech — and 2 product updates. No less, no more.

Your email:

Get access

## File uploading and encoding. Made simple.

Transloadit streamlines file handling for developers, trusted by brands like Coursera and The New York Times. We’re known for a reliable API, top-notch support, and a strong commitment to open source, with projects like [Uppy⁠](https://uppy.io) and [Tus⁠](https://tus.io) setting standards in file processing.

[Sign up](/c/)[Book a Demo](https://survey.typeform.com/to/kRg47Xi5)

No credit card needed · 5 GB included in the free plan

Cancel anytime