Import bibliothèque javascript object externe

Support
1

Bonjour,

Je suis actuellement en train de travailler sur la mise en place d’un tableau ayant des fonctionnalités diverse (tri, export, pagination, …).

Pour cela, j’ai trouvé des bibliothèques Javascript bootstrap table, et j’utilise un objet externe ; jusqu’à présent les appels des différentes librairies JS se faisaient via le header HTML.

Je dois intégrer ces bibliothèques directement dans l’application (demande du client).

J’ai donc utilisé les ressources dans l’objet externe (EXT1 … EXT6 sont les bibliothèques JS à intégrer) cf. image :

image
image573×522 10.9 KB

Puis je les charges via les lignes de codes ci-après :

@Override
	public Object display(Parameters params) {

		try {
			setDecoration(false);
			
			String[] jsURL = {HTMLTool.getResourceJSURL(this, "EXT1"),HTMLTool.getResourceJSURL(this, "EXT2"),HTMLTool.getResourceJSURL(this, "EXT3"),HTMLTool.getResourceJSURL(this, "EXT4"),HTMLTool.getResourceJSURL(this, "EXT5"),HTMLTool.getResourceJSURL(this, "EXT6")};
			
	        this.appendJSIncludes(jsURL);

<suite du code>

Le problème est que lors de l’affichage, les bibliothèques ne sont pas chargées.

Pouvez-vous m’indiquer la démarche à suivre pour intégrer correctement ces bibliothèques JS ?

Merci d’avance,

Cordialement,

Benoît

2
  • debuggez ce que vaut HTMLTool.getResourceJSURL(this, “EXT1”) via AppLog, à mon avis c’est null car à priori getResourceJSURL ne va pas chercher les types “Autre”.
  • debuggez côté navigateur / onglet network les URL appelées et les réponses

Essayez de mettre le type Javascript et non pas Other.

Sinon on peut aussi charger les libs depuis le front via un $ui.loadScripts dans votre SCRIPT.

.

3

Bonjour Francois,

Le fait de mettre “autre” était un test supplémentaire, mais avec JS en type, les applog sortent bien l’url, mais toujours pas de résultats. Nous avons aussi essayé de placer les url dans le header du HTML et la encore pas de résultats, alors que les liens ouvrent bien sur les bons fichiers JS.

4

Pas mal d’exemples sont donnés ici :
https://docs.simplicite.io/documentation/01-core/externalobject-code-examples.md

Responsive UI

Typical usage (using Java) as a standalone standard page for version 4.0 responsive UI is something like:

package com.simplicite.extobjects.MyModule;

import com.simplicite.util.tools.Parameters;
import com.simplicite.util.tools.HTMLTool;

public class MyExtObj extends com.simplicite.util.ExternalObject {
    private static final long serialVersionUID = 1L;

    @Override
    public Object display(Parameters params) {
        appendCSSIncludes(...);
        appendJSIncludes(...);
        setHTML("<div id=\"mydiv\"></div>");
        return javascript("MyExtObj.render($('#mydiv'))");
    }
}

où MyExtObj.render = function(ctn) est à définir dans votre fichier SCRIPT pour dessiner ce qu’il faut dans ctn.

Ensuite debugger sur votre navigateur ce qui est chargé.

5

Pour mémoire ce répo GitHub https://github.com/simplicitesoftware/module-test3rdparty contient un module avec des exemples d’objets externes avec utilisation de libs tierces:

  • Cytoscape JS
  • Bootstrap table

Y compris en vue d’un objet métier