2016-12-18 4 views
0

Я абсолютно новичок в Додзе, поэтому мой вопрос может быть слишком очевиден. Сожалею. Я программно создал сложное меню, в том числе MenuBar, на основе строк, выбранных из БД. Все проблемы были решены помимо одного: выравнивание конечных элементов и элементов подменю различается. How it looks like Все подменю в основном были отображены в одной строке. Только добавив MenuSeparator, я смог их разделить. Я потерял Я нашел пример в Интернете, который показывает, что мне нужно (включая правую стрелку для подменю) Example. Я использовал точно такой же алгоритм для создания меню. Но я не могу получить тот же результат. Пожалуйста, помогите.Выравнивание элементов в PopupMenuBarItem


Я заметил, что изображение недоступно. В чистом тексте выглядит следующим образом:

    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 
       })); 
      } 
     } 
    } 


}, 
+0

Можете ли вы поделиться какой-то код? Если нет, можете ли вы создать [SSCCE] (http://sscce.org/) JSfiddle? – Mo3z

+0

Извините, только что отметил, что вы комментируете. Вскоре я добавлю код, хотя не думаю, что это поможет - я сделал именно то, что видел на примерах. Благодарю. – Gena

+0

Это действительно работает, я уверен, что что-то не так с вашей настройкой. нет необходимости менять теги, так как это может нарушить много вещей. – xamiro

ответ

0

Я нашел в чем проблема. В требуемом массиве define я ошибочно импортирую PopupMenu bar Элемент вместо PopupMenuItem. В функции параметр называется right - PopupMenuItem, но, очевидно, это не помогло ...

Спасибо всем, кто пытался мне помочь.

С уважением, Гена

Смежные вопросы