Как скрыть детали виджета Аккордеон? - PullRequest
3 голосов
/ 03 мая 2019

У меня проблемы с расширением / не расширением.Я следовал инструкциям из шаблона рейтинга Vendor, но все еще не повезло ..

Что я сделал:

  1. Создание бумажного аккордеонного виджета (не карточек) с именем AccordionServeur с этим сценарием в событии onDataLoad:
var rows = widget.children._values;
    for (var i = 0; i < rows.length; i++) {
      if (rows[i].name.indexOf('AccordionServeurDetail') === -1) {
        rows[i].styles = ['collapsed'];
      }
    }

Добавьте несколько TextBox в AccordionServeurRow для редактирования значения (т. Е. Со связью данных)

Создайте клиентский скрипт с этим кодом:

function expandAccordionRow(accordionRow) {
  var rows = accordionRow.parent.children._values;
  var i = 0;
  for (i = 0; i < rows.length; i++) {
    if (rows[i].name.indexOf('AccordionServeurDetail') > -1) {
      rows[i].styles = [];
    } else {
      rows[i].styles = ['collapsed'];
    }
  }
  accordionRow.styles = [];
}
function collapseAccordionRow(accordionRow) {
  var rows = accordionRow.parent.children._values;
  var i = 0;
  accordionRow.styles = ['collapsed'];
  for (i = 0; i < rows.length; i++) {
    if (rows[i].name.indexOf('AccordionServeurDetail') > -1) {
      rows[i].styles = ['hidden'];
    }
  }
}
function toggleAccordionRow(accordionRow) {
  if (accordionRow.styles.length === 0) {
     collapseAccordionRow(accordionRow);
  } else {
        expandAccordionRow(accordionRow);
  }
}
На AccordionServeurRow в событии onAttach я запускаю этот скрипт:
widget.styles = ['collapsed'];
widget.getElement().removeAttribute('aria-expanded');
В AccordionServeurRow, в событии onClick, я запускаю этот скрипт:
toggleAccordionRow(widget);
В AccordionServeurDetail в событии dataLoad я запускаю этот сценарий:
widget.styles=['hidden'];

Но он все равно расширяет детали, когда я открываю страницу, где находится виджет.Кроме того, деталь остается расширенным событием, если я нажму на AccordionRow.Я что-то упустил в скрипте или это из-за параметров в виджете?

РЕДАКТИРОВАТЬ: Я нашел решение.Вы должны создать стиль «свернутый» и вызвать его в сценарии выше:

.app-AccordionRow.collapsed {
  margin: 0 !important;
}

.app-AccordionDetail.hidden {
  display: none !important;
}

1 Ответ

0 голосов
/ 27 мая 2019

Вы должны создать стиль "свернутый" и "скрытый" в редакторе стилей в глобальной части стиля, чтобы вызвать их в приведенном выше сценарии:

.app-AccordionRow.collapsed {
  margin: 0 !important;
}

.app-AccordionDetail.hidden {
  display: none !important;
}
...