У меня проблемы с расширением / не расширением.Я следовал инструкциям из шаблона рейтинга Vendor, но все еще не повезло ..
Что я сделал:
- Создание бумажного аккордеонного виджета (не карточек) с именем 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;
}