Bonjour,

Je voulais créer un menu dynamique, alors j'ai fait ça:

var UI = (function () {
    "use strict";
    
    function setMenu(strings, functions) {
        var i = 0,
            ul = document.getElementById("menu"),
            li = null;

        ul.innerHTML = "";

        for (i = 0; i < strings.length; i += 1) {
            li = document.createElement("li");
            li.appendChild(document.createTextNode(strings[i]));
            li.setAttribute("onclick", functions[i]);
            ul.appendChild(li);
        }
    }

    // [...]
        
    function loadMenu1() {
        var strings = ['Sub Menu 1', 'Sub Menu 2'],
            funcs = [
                loadSubMenu1,
                loadSubMenu2
            ];

        setMenu(strings, funcs);
    }
        
    return {
        LoadMain: function () {
            var menustrings = ['Menu 1', 'Menu 2'],
                main_menu = [
                    loadMenu1,
                    loadMenu2
                ];

            setMenu(menustrings, main_menu);
        }
    };
}());

Mais les fonctions placées sur 'onclick' ne marchent pas.
Que dois-je faire pour créer un menu dynamique en appelant les fonctions comme il faut s'il vous plait ?

-
Edité par benjahinfo888 25 août 2016 à 15:27:32

Hello,

Si tu regardes dans les sources de ta page, ton attribut onClick a comme valeur la description complète de ta fonction.

Une approche qui fonctionne serait :

li.setAttribute("onclick", functions[i].name + '()');

Le problème après ça c'est qu'il ne trouve pas la fonction quand tu l'appelles. J'imagine que c'est parce que la fonction n'est pas définie dans le scope de la page ? Je te laisse vérifier

Oh c'est super ça marche très bien merci!
Comme tu l'avais prévu j'ai du déplacer toutes mes fonctions loadMenuX & loadSubMenuX sous le return afin qu'elle puissent être accessible par la page.

Ensuite, j'ai rajouté ceci à ton code:

li.setAttribute("onclick", 'UI.' + functions[i].name + '()');

Merci beaucoup pour ton aide!!!