jQuery is a Javascript library which purpose is to make it much easier to use JavaScript on your website, OutSystems platform by default is using this library although it only supports officially two specific version (1.4.2 or 1.8.3). During the years jQuery launched new versions and these introduced some break and changes, or some functions were deprecated or renamed.
Although the majority of the plugins work with version 1.8.3 sometimes you may want to integrate a plugin which is only supported by a newer version (e.g. version 3.2.1)
The problem is when importing a recent jQuery version, this will compromise the OutSystems internal functionality (e.g: ajax refresh, UI Patterns) as the newer version has break and changes, so we can't simply overwrite the jQuery
How can I integrate a jQuery plugin for a recent jQuery version?
Using jQuery function NoConflict() you can load the newer version and then restore the previous version of the jQuery.
However, we can't simply add the library script using the action AddJavaScriptTag, we will need to import by appending to the body using the HTML <script>, once the recent library is loaded we can run the specific code which is depended on this new version and last we run the function NoConflict() to revert to OutSystems jQuery version 1.8.3.
A quick test and you can check the library being swapped between both versions, before and after running the specific code for version 3.2.1
Attached you can find a code sample with a ready to use Webblock load the version 3.2.1 and run the specific code, or you can quickly check here.
If you have any question or other suggestion please fill free to share
Awesome!
Great Scott! Awesome!
Great explanation!
Great post, thanks for the share!
I used it for an inputmask using version 2.2.4 of JQuery. The thing I came across that after doing an ajax refresh the page would lose its JQuery reference. The noconflict reverts it back from version 1.8.3. Adding an input parameter that indicates if it is a ajax refresh or not, and depending on that parameter executing the noconflict solved the problem.
I added the code.
Thanks again for this!
Hello
Just updating a newer version of the sample, it includes also add an Ajax refresh
Unfortunately, this is upgraded to version OS11 as my personal is on that version
Thanks,
Hello.
May I ask if jQuery 3.2.1 is compatible in Outsystems 10?
If Yes, How do I upgrade to the said version?
Thank you.
Hello Carlos,
OutSystems web applications support by default only two versions 1.8.3 and 1.4.2, the latest is deprecated (documentation)
I don't recommend changing the run-time jQuery to a recent library as the internal javascript libraries of the platform are dependent on version 1.8.3
Let us say you want to integrate a jQuery plugin which is not compatible with version 1.8.3 and only compatible with version 3.2.1. For that specific integration, you can use this technique to temporarily change the run-time version to 3.2.1, execute the jQuery plugin and swap back the run-time jQuery version to 1.8.3 in order to prevent triggering exceptions in the platform JS libraries
To implement on version 10, I'm afraid you will have to apply manually the code by opening the module of version 11
José Fábio Vieira wrote:
If I will implement it on version 10, will it take a lot of work if done manually?