This is a migrated thread and some comments may be shown as answers.

Expand panel is not working .

1 Answer 243 Views

PanelBar

This is a migrated thread and some comments may be shown as answers.

Toan asked on 14 Sep 2015, 08:46 AM

I am creating a kendo panelbar that contains 3 panel and each panel contains kendogrid , the content will load data after kendodropdownlist change occur. If the first time I choose value on dropdownlist I can expand all panels, next time I choose another values on dropdownlist then I cannot expand panel anymore except the panel that set default expand: true and next time I can expand. I don't understand the reason why?

Here is the code of my panel bar:

var expenseConflitViewHTML = '<div class="q-expense-panel-wrap"><div id="conflitsheetsgrid"></div></div>';
var expenseDraftViewHTML = '<div class="q-expense-panel-wrap"><div id="draftsheetsgrid"></div></div>';
var expenseSubmittedViewHTML = '<div class="q-expense-panel-wrap"><div id="submittedsheetsgrid"></div></div>';
var expensePaidViewHTML = '<div class="q-expense-panel-wrap"><div id="paidsheetsgrid"></div></div>';

$("#expensesheetpanel").kendoPanelBar(
{
dataSource: [
{
text: '<span class="q-bold">' + ExpensesConstants.lbConflitSheet + '</span>',
encoded: false,
content: expenseConflitViewHTML
},
{
text: '<span class="q-bold">' + ExpensesConstants.lbDraftSheet + '</span>',
encoded: false,
expanded: true,
content: expenseDraftViewHTML
},
{
text: '<span class="q-bold">' + ExpensesConstants.lbSubmittedSheet + '</span>',
encoded: false,
content: expenseSubmittedViewHTML
},
{
text: '<span class="q-bold">' + ExpensesConstants.lbPaidSheet + '</span>',
encoded: false,
content: expensePaidViewHTML
},

],
expandMode: "multiple"
});

Here is the kendogrid :

$("#submittedsheetsgrid").kendoGrid({
columns: [
{
field: "UserFullname",
title: ExpensesConstants.lbEmployeeName,
width: 180,
hidden: isHiddenEmployeeName

},
{
field: "SheetDescription",
title: ExpensesConstants.lbSheetName,
width: 500

},
{
field: "AdvanceAmountDisplay",
title: ExpensesConstants.lbAdvance
},
{
field: "ExpenseAmountDisplay",
title: ExpensesConstants.lbExpenseTotal
}
],
scrollable: true,
editable: false,
filterable: true,
dataSource: dsSubmittedSheet,
dataBound: function (e) {
var grid = e.sender;
if (grid.dataSource.total() == 0) {
var msg = ExpensesConstants.msgSubmittedSheetEmpty;
var colCount = grid.columns.length;
var emptyRow = '<tr><td colspan="' + colCount + '">' + msg;
e.sender.tbody.parent().width(e.sender.thead.width()).end().html(emptyRow);
}
}
});

......

Could someone please help me?

Thanks for your help!

Expand panel is not working .

1 Answer, 1 is accepted