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

expand all panels when printing kendo panelbar

1 Answer 238 Views
PanelBar
This is a migrated thread and some comments may be shown as answers.
Toan
Top achievements
Rank 1
Toan asked on 14 Sep 2015, 09:45 AM

Hi Telerik,

I have a kendopanelbar that contains 3 panel . I want to expand all panels to print details of gird in panels. I set expandMode is 'single'. The problem is In paper printer, It only show 1 panel and rest of panels collapse. I attempted to set expandMode is 'multiple' and It worked well But I just want expandMode is 'single'.

Here is my code:

function fqtt_PrintExpensesGrid() {
        var gridElement = $("#expensesheetpanel");
            gridElement.data("kendoPanelBar").expand($("li",gridElement.element)),
        win = window.open('', '', 'width=1000, height=500'),
        doc = win.document.open(),
        
        htmlStart =
            '<!DOCTYPE html>' +
            '<html>' +
            '<head>' +
            '<meta charset="utf-8" />' +
            '<title>' + ExpensesConstants.lbExpensesTitle + '</title>' +
            '<link href="' + ExpensesConstants.cssKendoCommon + '" rel="stylesheet" /> ' +
            '<link href="' + ExpensesConstants.cssKendoSilver + '" rel="stylesheet" /> ' +
            '<link href="' + ExpensesConstants.cssQttlayout + '" rel="stylesheet" type="text/css"> ' +
            '<link href="' + ExpensesConstants.cssQttprintreports + '" rel="stylesheet" type="text/css"> ' +
            '</head>' +
            '<body>',
        htmlEnd =
            '</body>' +
            '</html>';
        var decodedAddress = $('<div></div>').html(ExpensesConstants.lbCompanyAdress).text();
        
        doc.write(htmlStart + gridElement.clone()[0].outerHTML + htmlEnd);
 
        doc.close();
        win.print();
    }​

 

Please help me!

Many Thanks.

1 Answer, 1 is accepted

Sort by
0
Daniel
Telerik team
answered on 16 Sep 2015, 09:07 AM
Hello,

You could temporarily change the expandMode option and expand all items while printing e.g.
var panelbar =  $("#expensesheetpanel").data("kendoPanelBar");
 
var items = panelbar.element.children();
var expanded = items.filter(".k-state-active");
panelbar.setOptions({
    expandMode: "multiple"
});
panelbar.expand(items, false);
 
//print
 
panelbar.setOptions({
    expandMode: "single"
});
panelbar.collapse(items.not(expanded), false);


Regards,
Daniel
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
PanelBar
Asked by
Toan
Top achievements
Rank 1
Answers by
Daniel
Telerik team
Share this question
or