Thread ID: |
Created: |
Updated: |
Platform: |
Replies: |
| 149757 | Dec 7,2019 10:57 PM UTC | Jan 6,2020 11:40 AM UTC | JavaScript - EJ 2 | 11 |
|
Tags: Grid |
|
Index.js
var grid = new ej.grids.Grid({
dataSource: window.orderDatas,
allowPdfExport: true,
toolbar: ['ExcelExport', 'PdfExport'],
pageSettings: { pageSize: 7 },
columns: [
{ field: 'OrderID', headerText: 'Order ID', width: 100, textAlign: 'Center' },
{ field: 'CustomerID', headerText: 'Customer ID', width: 100, textAlign: 'Center' },
{ field: 'Freiaght', width: 100, format: 'C2', textAlign: 'Center' },
{ field: 'ShipCountry', headerText: 'Ship Country', width: 100 , textAlign: 'Center'},
],
});
grid.appendTo('#Grid');
grid.pdfHeaderQueryCellInfo = function(args){
var len = grid.columns.length;
for (let i = 0; i < len; i++) {
args.cell.gridRow.pdfGrid.columns.getColumn(i).width = 50; // Set the column width as 50
}
}
grid.toolbarClick = function (args) {
if (args.item.id === 'Grid_pdfexport') {
grid.pdfExport();
}
}; |
|
Index.js
var grid = new ej.grids.Grid({
allowPdfExport: true,
pdfQueryCellInfo : childexport,
toolbar: ['PdfExport'],
pageSettings: { pageSize: 7 },
columns: [
…
],
childGrid: {
…
},
});
grid.appendTo('#Grid');
var parent=true; var child=true;
function childexport(args){
if(grid.columns[0].field === args.column.field){
var len = grid.columns.length;
for (let i = 0; i < len; i++) {
args.cell.gridRow.pdfGrid.columns.getColumn(i).width = 100; // column width for Parent grid
}
}
if(grid.childGrid.columns[0].field === args.column.field ){
var len = grid.childGrid.columns.length;
for (let i = 0; i < len; i++) {
args.cell.gridRow.pdfGrid.columns.getColumn(i).width = 75; // column width for Child grid
}
}
}; |
|
App.component.ts
toolbarClick(args: ClickEventArgs): void {
switch (args.item.text) {
case 'Excel Export':
const appendExcelExportProperties: ExcelExportProperties = {
multipleExport: { type: 'NewSheet' },
hierarchyExportMode: "All"
};
const GridExport: Promise<any> = this.grid.excelExport(appendExcelExportProperties, true);
GridExport.then((workbook: any) => {
var len = workbook.worksheets[0].columns.length;
for(var j=0; j<len; j++){
workbook.worksheets[0].columns[j].width = 200; // here you can set the width
}
const book: Workbook = new Workbook(workbook, 'xlsx');
book.save('Export.xlsx');
});
}
}
|
|
Index.js
ej.base.enableRipple(true);
var grid = new ej.grids.Grid({
dataSource: window.orderDatas.slice(0,5),
allowPdfExport: true,
pdfQueryCellInfo : childexport,
toolbar: ['PdfExport'],
pageSettings: { pageSize: 7 },
columns: [
…
],
childGrid: {
dataSource: data,
queryString: 'OrderID',
columns: [
…
],
},
});
grid.appendTo('#Grid');
function childexport(args){
if(grid.getVisibleColumns()[0].field === args.column.field){ // getVisibleColumns() method fetches the visible columns
var len = grid.getVisibleColumns().length;
for (let i = 0; i < len; i++) {
args.cell.gridRow.pdfGrid.columns.getColumn(i).width = 120;
}
}
for(var j=0; j<grid.childGrid.columns.length; j++){ // for child grid
if(grid.childGrid.columns[j].field === args.column.field ){
var lengths = args.cell.gridRow.pdfGrid.columns.columns.length; // length of only visible columns
for (let i = 0; i < lengths; i++) {
args.cell.gridRow.pdfGrid.columns.getColumn(i).width = 75;
}
}
grid.toolbarClick = function (args) {
if (args.item.id === 'Grid_pdfexport') {
var exportProperties = {
hierarchyExportMode: "All",
}
grid.pdfExport(exportProperties);
}
}; |
|
Index.js
var grid = new ej.grids.Grid({
dataSource: window.orderDatas.slice(0,5),
allowPdfExport: true,
allowGrouping: true,
groupSettings: { showGroupedColumn: true }, // this allows to add the grouped column for width calculation
pdfQueryCellInfo : pdfexport,
toolbar: ['PdfExport'],
columns: [
{ field: 'OrderID', headerText: 'Order ID',visible: false, textAlign: 'Right', width: 120 },
{ field: 'CustomerID', headerText: 'CustomerID', width: 30},
{ field: 'Freight', headerText: 'Freight', width: 90 },
{ field: 'ShipCountry', headerText: 'ShipCountry', width: 130 },
],
});
grid.appendTo('#Grid');
function pdfexport(args){
var pdfcol = args.cell.gridRow.pdfGrid.columns;
var gridcol = grid.getVisibleColumns();
pdfcol.getColumn(0).width = gridcol[0].width;
pdfcol.getColumn(1).width = gridcol[1].width;
pdfcol.getColumn(2).width = gridcol[2].width;
}
|
|
Index.js
var grid = new ej.grids.Grid({
allowGrouping: true,
groupSettings: { showGroupedColumn: true, captionTemplate: '#captiontemplate', columns: ['CustomerID'] },
columns: [
…
],
});
grid.appendTo('#Grid');
grid.toolbarClick = function (args) {
if (args.item.id === 'Grid_pdfexport') {
grid.pdfExport();
}
}; |
|
Index.html
<html><head><script src="//ej2.syncfusion.com/javascript/demos/grid/default-exporting/datasource.js" type="text/javascript"></script>
<script src="https://cdn.syncfusion.com/ej2/dist/ej2.min.js" type="text/javascript"></script>
<link rel='nofollow' href="https://cdn.syncfusion.com/ej2/material.css" rel="stylesheet">
<style>
<div class="stackblitz-container material">
<div class="control-section">
<div class="content-wrapper">
<script id="captiontemplate" type="text/x-template">
${field} - ${key}
</script>
<div id="Grid">
</div>
</div>
</div>
</div></body></html> |
|
Index.js
let grid: Grid = new Grid(
{
dataSource: data,
allowPaging: true,
toolbar: ['PdfExport'],
allowGrouping: true,
groupSettings: { captionTemplate: '#captiontemplate', columns: ['location'] },
allowPdfExport: true,
columns: [
{ field: 'name', headerText: 'name', textAlign: 'Right', width: 100 },
{ field: 'location', headerText: 'location', width: 150 },
{ field: 'purchase', headerText: 'purchase', width: 100, textAlign: 'Right'}
],
});
grid.appendTo('#Grid');
grid.toolbarClick = (args: ClickEventArgs) => {
if (args.item.id === 'Grid_pdfexport') {
grid.pdfExport();
}
};
grid.exportGroupCaption= (args) => { // define exportGroupCaption event
args.captionText =args.captionText.split("-")[0] // this will split the item values in the exported file
}
|
This post will be permanently deleted. Are you sure you want to continue?
Sorry, An error occured while processing your request. Please try again later.
This page will automatically be redirected to the sign-in page in 10 seconds.
You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.
