Thread ID: |
Created: |
Updated: |
Platform: |
Replies: |
151385 | Feb 10,2020 09:50 AM UTC | Feb 13,2020 06:25 AM UTC | Angular - EJ 2 | 3 |
![]() |
Tags: PivotView |
drillThrough(args): void {
if (args.currentCell.axis === 'value') {
args.currentTarget.innerHTML = '<input type="text" class="e-input e-pivot-cell-edit" maxlength="10"></input>';
this.rowIndex = args.currentCell.rowIndex;
this.columnIndex = args.currentCell.colIndex;
this.pivotObj.grid.queryCellInfo = this.queryCell.bind(this);
args.currentTarget.querySelector('input').addEventListener('focusout', (event) => this.onFocusOut(args));
this.previousArgs = args;
this.previousValue = args.currentCell.value;
}
}
onFocusOut(args: any) {
// To maintain the value in pivot table
let fields: object[] = [];
let row: string[] = args.currentCell.rowHeaders.split(this.pivotObj.engineModule.valueSortSettings.headerDelimiter);
let column: string[] = args.currentCell.columnHeaders.split(this.pivotObj.engineModule.valueSortSettings.headerDelimiter);
for (let j: number = 0; j < row.length; j++) {
let field: object = {};
field[this.pivotObj.dataSourceSettings.rows[j].name] = row[j];
fields.push(field);
}
for (let j: number = 0; j < column.length; j++) {
let field: object = {};
field[this.pivotObj.dataSourceSettings.columns[j].name] = column[j];
fields.push(field);
}
let index: number[] = [];
for (let i: number = 0; i < Pivot_Data.length; i++) {
let value: number = 0;
for (let j: number = 0; j < fields.length; j++) {
if (Pivot_Data[i][Object.keys(fields[j])[0]] &&
String(Pivot_Data[i][Object.keys(fields[j])[0]]) === fields[j][Object.keys(fields[j])[0]]) {
value++;
}
}
if (value === fields.length) {
index.push(i);
}
}
for (let i: number = 0; i < index.length; i++) {
Pivot_Data[index[i]][args.currentCell.actualText] =
Number(args.currentTarget.querySelector('input').value.replace(/[^0-9]+/g, "")) / index.length;
}
if (index.length) {
(this.pivotObj as any).initEngine();
}
}
queryCell(args: any): void {
(this.pivotObj.renderModule as any).rowCellBoundEvent(args);
if (args.cell && JSON.parse(args.cell.getAttribute('aria-colIndex')) == this.columnIndex && JSON.parse(args.cell.getAttribute('index')) == this.rowIndex) {
// Here you can apply any styles to the specified class in app.component.css file.
args.cell.classList.add('selectedCell')
}
} |
Hi shreekumar,Thanks for contacting Syncfusion support.Based on your requirement we have prepared a sample to edit the cell value and highlight the modified value in drillThrough event. Kindly check the below code example.Code Example:
drillThrough(args): void {if (args.currentCell.axis === 'value') {args.currentTarget.innerHTML = '<input type="text" class="e-input e-pivot-cell-edit" maxlength="10"></input>';this.rowIndex = args.currentCell.rowIndex;this.columnIndex = args.currentCell.colIndex;this.pivotObj.grid.queryCellInfo = this.queryCell.bind(this);args.currentTarget.querySelector('input').addEventListener('focusout', (event) => this.onFocusOut(args));this.previousArgs = args;this.previousValue = args.currentCell.value;}}onFocusOut(args: any) {// To maintain the value in pivot tablelet fields: object[] = [];let row: string[] = args.currentCell.rowHeaders.split(this.pivotObj.engineModule.valueSortSettings.headerDelimiter);let column: string[] = args.currentCell.columnHeaders.split(this.pivotObj.engineModule.valueSortSettings.headerDelimiter);for (let j: number = 0; j < row.length; j++) {let field: object = {};field[this.pivotObj.dataSourceSettings.rows[j].name] = row[j];fields.push(field);}for (let j: number = 0; j < column.length; j++) {let field: object = {};field[this.pivotObj.dataSourceSettings.columns[j].name] = column[j];fields.push(field);}let index: number[] = [];for (let i: number = 0; i < Pivot_Data.length; i++) {let value: number = 0;for (let j: number = 0; j < fields.length; j++) {if (Pivot_Data[i][Object.keys(fields[j])[0]] &&String(Pivot_Data[i][Object.keys(fields[j])[0]]) === fields[j][Object.keys(fields[j])[0]]) {value++;}}if (value === fields.length) {index.push(i);}}for (let i: number = 0; i < index.length; i++) {Pivot_Data[index[i]][args.currentCell.actualText] =Number(args.currentTarget.querySelector('input').value.replace(/[^0-9]+/g, "")) / index.length;}if (index.length) {(this.pivotObj as any).initEngine();}}queryCell(args: any): void {(this.pivotObj.renderModule as any).rowCellBoundEvent(args);if (args.cell && JSON.parse(args.cell.getAttribute('aria-colIndex')) == this.columnIndex && JSON.parse(args.cell.getAttribute('index')) == this.rowIndex) {// Here you can apply any styles to the specified class in app.component.css file.args.cell.classList.add('selectedCell')}}Meanwhile, we have prepared a sample for your reference.We hope that the above sample meets your requirement if not kindly share us more details along with screen-shots/video if possible.Regards,Sivamathi.
<div class="row">
<ejs-pivotview #pivotview id='PivotView' [dataSourceSettings]=dataSourceSettings showTooltip='false' width='100%'
height='300' [gridSettings]='gridSettings' [editSettings]='editSettings' (drillThrough)='drillThrough($event)' (dataBound)='dataBound($event)'>
</ejs-pivotview>
</div>
dataBound(args): void {
this.pivotObj.grid.addEventListener('keyPressed', this.keyDownHandler.bind(this));
}
keyDownHandler(args: KeyboardEventArgs) {
args.cancel = true;
}
|
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.