Mithun Pradhan

Mithun Pradhan

  • 1.6k
  • 150
  • 21.1k

how to pdf export ?

Aug 28 2024 5:55 AM

My code

<ejs-grid id="GridFilteredInstrumentSampleData" dataSource="Model.FilteredInstrumentSampleDataViewModel" allowGrouping="true" allowExcelExport="true"
          allowPdfExport="true" toolbar="toolbarItems" toolbarClick="onToolbarClick"
          allowSorting="true" allowPaging="true" allowTextWrap="true" allowFiltering="true">
    <e-grid-groupsettings showDropArea="false" columns="@(new[] { "InstrumentName" })"></e-grid-groupsettings>
    <e-grid-textwrapsettings wrapMode="Both"></e-grid-textwrapsettings>
    <e-grid-filterSettings type="Menu" mode="OnEnter" showFilterBarStatus="true" />
    <e-grid-pageSettings pageSize="10" pageSizes="@(new[] {"10","50", "100", "All"})" />
    <e-grid-aggregates>
        <e-grid-aggregate>
            <e-aggregate-columns>
                <e-aggregate-column field="NumberOfSample" type="Sum" groupCaptionTemplate="Total Number Of Sample: ${Sum}">
                </e-aggregate-column>
            </e-aggregate-columns>
        </e-grid-aggregate>
    </e-grid-aggregates>
    <e-grid-columns>
        <e-grid-column field="FacilityName" headerText="Facility Name" width="20px"></e-grid-column>
        <e-grid-column field="InstrumentName" headerText="Instrument Name" width="20px"></e-grid-column>
        <e-grid-column field="NumberOfSample" headerText="No. Of Samples" width="10px"></e-grid-column>
        <e-grid-column field="RequisitionStatus" headerText="Requisition Status" width="10px"></e-grid-column>
        <e-grid-column field="CreatedOn" headerText="CreatedOn" format="dd-MM-yyyy" width="20px"></e-grid-column>
    </e-grid-columns>
</ejs-grid>
<script>
function onToolbarClick(args) {
    switch (args.item.id) {
        case 'excelExport':
            ExcelExport();
            break;
        case 'pdfExport':
            PdfExport();
            break;
    }
}

function ExcelExport() {
    const gridObj = document.getElementById("GridFilteredInstrumentSampleData").ej2_instances[0];
    const excelExportProperties = {
        fileName: "RadGridExport.xlsx"
    };
    gridObj.excelExport(excelExportProperties);
}
function PdfExport() {
    const gridObj = document.getElementById("GridFilteredInstrumentSampleData").ej2_instances[0];
    const pdfExportProperties = {
        fileName: "RadGridExport.pdf",
        allowGrouping: true, // Ensure grouping is enabled during export
        group: gridObj.groupModule.groupSettings.columns, // Pass current group settings
        theme: {
            header: {
                fontColor: '#000000',
                fontName: 'Calibri',
                fontSize: 8,
                bold: true,
                fillColor: '#CCCCCC'
            },
            record: {
                fontColor: '#000000',
                fontName: 'Calibri',
                fontSize: 8
            }
        },
        columns: [
            { field: 'FacilityName', headerText: 'Facility Name', width: 60 },
            { field: 'InstrumentName', headerText: 'Instrument Name', width: 80 },
            { field: 'NumberOfSample', headerText: 'No. Of Samples', width: 60 },
            { field: 'RequisitionStatus', headerText: 'Requisition Status', width: 80 },
            { field: 'CreatedOn', headerText: 'CreatedOn', width: 60, format: { type: 'date', format: 'dd-MM-yyyy' } }
        ],
        allowPageBreaks: true,
        pageSize: 'A4',
        pageOrientation: 'Portrait',
        height: 'auto'
    };
    gridObj.pdfExport(pdfExportProperties);
}
</script>

Allow Pdf Export Not Working please Resolve


Answers (4)