BPMN/javascript

how to read and parse a BPMN file in JavaScript
this is my BPMN file:
irm.bpmn (9.8 KB)

Check out the examples: GitHub - bpmn-io/bpmn-js-examples: Some examples how to use bpmn-js

1 Like

i tried this code that takes a BPMN file and age input from the user, and displays a list of processes based on the age.

// Fonction qui affiche les tâches suivantes dans le processus BPMN basé sur l'âge saisi function showNextTasks() { // Récupérer le fichier BPMN choisi par l'utilisateur var file = document.getElementById("file-input").files[0];
        // Récupérer l'âge saisi par l'utilisateur
        var age = document.getElementById("age-input").value;

        // Créer un objet FileReader pour lire le contenu du fichier BPMN
        var reader = new FileReader();

        // Définir une fonction à exécuter lorsque le fichier est lu
        reader.onload = function(e) {
            // Récupérer le contenu du fichier sous forme de texte
            var text = e.target.result;

            // Parser le texte en un objet DOM
            var xmlDoc = $.parseXML(text);

            // Sélectionner les éléments task et exclusiveGateway du document xml
            var tasks = xmlDoc.getElementsByTagName("bpmn:userTask");
            var gateways = xmlDoc.getElementsByTagName("bpmn:exclusiveGateway");

            // Créer une variable pour stocker les noms des tâches suivantes
            var nextTasks = "";

            // Parcourir les éléments exclusiveGateway
            for (var j = 0; j < gateways.length; j++) {
                // Récupérer l'expression de la gateway courante
                var gatewayExpression = gateways[j].getAttribute("name");
                console.log(gatewayExpression);
                // Vérifier si l'âge de l'utilisateur est inférieur à 3 ans
                if (age < 3 && gatewayExpression == "age <3?") {
                    // Récupérer l'identifiant de la gateway courante
                    var gatewayId = gateways[j].getAttribute("id");
                    console.log(gatewayId);

                    // Parcourir les éléments sequenceFlow
                    for (var k = 0; k < xmlDoc.getElementsByTagName("bpmn:sequenceFlow").length; k++) {
                        // Récupérer l'élément sequenceFlow courant
                        var sequenceFlow = xmlDoc.getElementsByTagName("bpmn:sequenceFlow")[k];
                        console.log(sequenceFlow);

                        // Vérifier si le flow va de la gateway courante vers une tâche
                        if (sequenceFlow.getAttribute("sourceRef") == gatewayId && sequenceFlow.getAttribute("targetRef").includes("userTask_")) {
                            // Récupérer l'identifiant de la tâche suivante
                            var nextTaskId = sequenceFlow.getAttribute("targetRef");

                            // Récupérer le nom de la tâche suivante
                            var nextTaskName = xmlDoc.querySelector("#" + nextTaskId).getAttribute("name");

                            // Ajouter le nom de la tâche suivante à la liste
                            nextTasks += "<li>" + nextTaskName + "</li>";
                        }
                        console.log(nextTasks)
                    }
                }

            }
            // Afficher la liste des tâches suivantes dans le HTML
            document.getElementById("result").innerHTML = nextTasks;
            console.log(nextTasks)
        };
        // Lire le fichier comme du texte
        reader.readAsText(file);
    }
</script>
I have a problem with the result not being displayed. I don't know where the problem is can you help me please!