Migration from jQuery (v1.8)

Compatibility notes for v1.8.0: ajaxs.js (vanilla) vs jquery.ajaxs.js (legacy)

In v1.8.0, the main plugin script was rewritten to native JS (without jQuery). Accordingly, some structural changes were made that may break backward compatibility.

Activation

• A fresh install uses the vanilla mode (without jQuery).
• Upgrading to 1.8.0+ preserves the jQuery variant, which can be switched to the vanilla version manually in the settings:

Main differences (code that may require updating)

• ajaxs() returns native XMLHttpRequest with added methods .done .fail .always and promise methods .then .catch .finally.
• data.ajax.dataType, data.ajax.processData, data.ajax.contentType are ignored. For headers use data.ajax.beforeSend(), for the response type — data.ajax.xhrFields.responseType.
• data.ajax.headers is not supported; specify headers in data.ajax.beforeSend().
• jQuery-specific options and jqXHR helpers are not available.

Differences in action payloads

The ajaxs_* events are now native CustomEvents. Data is passed in event.detail, not as arguments to the jQuery trigger.

jQuery (old):

jQuery( document ).on( 'ajaxs_done', function( event, data, jx ){
	// data = objdata
} )

Vanilla (new):

document.addEventListener( 'ajaxs_done', event => {
	const { data, jx } = event.detail
} )

It will also work like this:

jQuery( document ).on( 'ajaxs_start', ( event, data ) => {
	data = data || event.detail.data // <<< this needs to be added

	// your legacy code
} )

Difference in the callback parameter order for .fail()

The parameter order for the callback in ajaxs().fail() and ajaxs( ..., failFunc ) has changed.

jQuery (old variant):

ajaxs( 'my_action' )
	.fail( ( xhr, status, error ) => {
		// code
	} )

Vanilla (new variant):

ajaxs( 'my_action' )
	.fail( ( error, status, xhr ) => {
		// code
	} )

The same for the signature ajaxs( ..., failFunc ):

jQuery (old variant):

ajaxs( 'my_action', {}, null, null, ( xhr, status, error ) => {
	// code
} )

Vanilla (new variant):

ajaxs( 'my_action', {}, null, null, ( error, status, xhr ) => {
	// code
} )

No more jqXHR

ajaxs() returns a native [XMLHttpRequest](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest), to which the methods .done .fail .always and .then .catch .finally have been added. Previously, a jQuery wrapper [jqXHR](https://api.jquery.com/jQuery.ajax/) was returned.

Therefore, jQuery-specific options and jqXHR helpers will no longer work. Also, jqXHR parameters passed in data.ajax will no longer work:

ajaxs( 'my_action', {
	foo: 'bar',
	ajax: {
		headers: ...,
		dataType: ...,
		processData: ...,
		contentType: ...,
	}
} )

Now everything is done via data.ajax.beforeSend() and the data.ajax.xhrFields parameter

ajaxs( 'my_action', {
	foo: 'bar',
	ajax: {
		beforeSend( xhr ){
			xhr.setRequestHeader( 'X-Request-Source', 'ajax-simply' )
		},
		xhrFields: {
			timeout: 15000,
			withCredentials: true,
			responseType: 'json'
		}
	}
} )

However, all this will most likely not be needed. For the Ajax Simply plugin these parameters are a very specific thing and you probably did not use them anyway.

Rare differences (edge cases)

• window.jxs.handle_extra, window.jxs.consoleHTML, window.jxs.ajaxs_data, window.jxs._collect_data are no longer public API.

• FormData, passed to ajaxs(), is cloned before use. Subsequent changes do not affect the request.

• When files are present, object values serialize differently:

  • previously: objects were expanded into several name[] fields
  • now: plain JSON-serializable objects serialize into a single field

• <input type="file" multiple> without name[] now uploads multiple files (previously [] in the name were mandatory).

• extra.trigger now dispatches native DOM events; additional parameters are passed via event.detail.

• For analyzing XHR errors use xhr.response instead of xhr.responseJSON.

• extra.html now reinserts HTML and executes <script> tags from the received HTML.