We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

DrillThrough dialog size

Hello,

I am having trouble with implementing dialog size of drillthrough on Pivot table.

We have Pivot table that is opened upon doubleclick in a window below (Picture 1).

When we double click on a row in Pivot Table to edit, our drillthrough dialog size is really small (Picture 2) and I have not been able to make it larger (for example, remove max-height atribute from it) .

For the first dialog, we are using Material Dialog from @angular/material. Would it be helpful if we would try and implement your Dialog component instead ? Does it have option of injecting data into it ?


Thank you in advance .

Sincerely,


Ivan


Attachment: Pictures_df1d6d91.7z

3 Replies 1 reply marked as answer

AP AngelinFaithSheeba PaulvannanRajadurai Syncfusion Team November 17, 2022 05:47 AM

Please find the response below:

Query

Comments

I am having trouble with implementing dialog size of drillthrough on Pivot table.

We have Pivot table that is opened upon doubleclick in a window below (Picture 1).

When we double click on a row in Pivot Table to edit, our drillthrough dialog size is really small (Picture 2) and I have not been able to make it larger (for example, remove max-height atribute from it)

By default, drill through dialog renders with the height of pivot table. However, you can customize the drill through dialog by CSS. Please refer the below code example.

 

Code Example:

.e-drillthrough-dialog {

   max-height500px !important;

}

 

Meanwhile, we have prepared the sample for your reference.

 

Sample: https://stackblitz.com/edit/angular-ypv45t?file=app.component.css,index.html

Would it be helpful if we would try and implement your Dialog component instead ? Does it have option of injecting data into it ?

You can restrict the drill-through dialog by setting args.cancel to true in drillThrough event and you can create your own grid. Please refer the below code example and sample.

 

Code Example:

//triggers when a value cell is double clicked.

  drillThrough(args) {

    // Restrict the drill through dialog here.

    args.cancel = true;

    // You can also get the data and columns here.

    console.log(args.rawData);

    console.log(args.gridColumns);

  }

 

Sample: https://stackblitz.com/edit/angular-gghwyz?file=app.component.ts

 

Also, please refer the following documentation for more details about “DrillThrough”.

 

Document: https://ej2.syncfusion.com/angular/documentation/pivotview/drill-through/#begindrillthrough


Marked as answer

IG Ivan Galetic November 17, 2022 05:52 AM

Hello,


I have tried your 1st solution and it worked as a charm.


I was aware about the second solution, that would be my next step if the first one was not going to work.


Thank you on you fast reply.


Sincerely,

Ivan



AP AngelinFaithSheeba PaulvannanRajadurai Syncfusion Team November 18, 2022 06:56 AM

Thanks for the update. Please contact us if you have any other queries. We are always happy to assist you.


Loader.
Live Chat Icon For mobile
Up arrow icon