PopupMenuBarItem中的项目对齐

我绝对是Dojo的新手,所以我的问题可能太明显了。很抱歉 我已经根据从数据库中选择的行以编程方式创建了复杂菜单,包括菜单栏。 除了一个问题之外,所有问题都得到了解决:最终项目和子菜单项目的对齐方式不同。 How it looks like 所有子菜单主要呈现在同一行中。只有通过添加菜单分隔符,我才能将它们分开。 我迷路了我在互联网上找到了这个例子,它准确地显示了我所需要的(包括子菜单的右箭头) Example .我使用了完全相同的算法来创建菜单。但我不能得到同样的结果。 求求你,帮帮我。

我注意到图像无法访问。 在纯文本中,它看起来像:

                 Final 1
                 Final 2
                 Final 3
      DropDown 1
      DropDown 2

缩进取决于子菜单的宽度。

想一想,现在我知道发生了什么(不知道如何解决)。 问题在于小部件呈现。 最后一个菜单选项(叶)呈现为表行( tr 和 td 标签)。 PopupMenuItem呈现为div 行间 . 再一次,我不知道如何避免它。

这是代码。几个注意事项:

    1.The rows is the two dimensional array
    2.The rows with ParentID=0 are the MenuBarItems
    3.pM is the MenuBar widget

    createMenu: function (rows, pM) {

    var me = this; // for references from the event handlers, where 'this' means event origin (instead of lang.hitch)
    // First define the indexes of the DB fields
    var xMenu_Id;
    var xMenu_Title;
    var xParent;
    var xURL;
    var xUser_Roles;
    var i;
    for (i = 0; i < rows[0].length; i++) {
        switch (rows[0][i]) {
            case 'Menu_Id':
                xMenu_Id = i;
                break;
            case 'Menu_Title':
                xMenu_Title = i;
                break;
            case 'Parent':
                xParent = i;
                break;
            case 'URL':
                xURL = i;
                break;
            case 'User_Roles':
                xUser_Roles = i;
                break;
        }
    }
    // Define the function to filter the menu rows
    // Parameters:  r - two-dimentional rows array
    //              p - criterion (the parent menu ID)
    //              idx - index of needed field
    //              f - returned filtered array (no need to use in calling statement)
    var filterArray = function (r, p, idx, f) {
        f = dojo.filter(r, function (item) {
            return item[idx] == p;
        });

        return f;
    }
    // Define the recurcive function to create the sub menu tree for Menu bar item
    // Parameters: parentMenu - the menu to add childs
    //             parentID   - the ID of parent menu to select direct children
    //             role       - current user role
    var subMenuFactory = function (parentMenu, parentID, role) {
        var i;
        var fa = filterArray(rows, parentID, xParent);
        var sub;

        for (i = 0; i < fa.length; i++) {
            if (fa[i][xUser_Roles].indexOf(role) >= 0 || fa[i][xUser_Roles] == 'all') {
                if (fa[i][xURL] != '0') { // leaf
                    url = fa[i][xURL];
                    parentMenu.addChild(new MenuItem({
                        dir: 'ltr',
                        label: fa[i][xMenu_Title],
                        action: fa[i][xURL],
                        onClick: function () { me.menuAction(this.action); }
                    }));
                }
                else { // DropDown Node
                    sub = new DropDownMenu({ dir: 'ltr' });
                    subMenuFactory(sub, fa[i][xMenu_Id], role);
                    parentMenu.addChild(new MenuSeparator({}));
                    parentMenu.addChild(new PopupMenuBarItem({
                        dir: 'ltr',
                        label: fa[i][xMenu_Title],
                        popup: sub
                    }));
                }
            }
        }
    }
    // Get array of Menu bar items

    var filtered = filterArray(rows, 0, xParent);
    var pSub;
    var user_Role = this.user.Role;
    for (i = 0; i < filtered.length; i++) {
        if (filtered[i][xUser_Roles].indexOf(user_Role) >= 0 || filtered[i][xUser_Roles]=='all') {
            if (filtered[i][xURL] != '0') // leaf
            {
                pM.addChild(new MenuBarItem({
                    dir: 'ltr',
                    label: filtered[i][xMenu_Title],
                    action: filtered[i][xURL],
                    onClick: function () { me.menuAction(this.action); }
                }));
            }
            else { // DropDown Node
                pSub = new DropDownMenu({ dir: 'ltr' });
                subMenuFactory(pSub, filtered[i][xMenu_Id],user_Role);
                pM.addChild(new PopupMenuBarItem({
                    dir: 'ltr',
                    label: filtered[i][xMenu_Title],
                    popup: pSub
                }));
            }
        }
    }


},