Export PDF with locked column in Kendo Grid Vue

[Dev]

Hi,

Here is the example.

https://stackblitz.com/edit/tobv8y?file=src%2Fmain.vue

The column "ProductID" is locked.

When I export PDF, this column doesn't show on PDF file. (As pic)

 

 

How can I export PDF with locked column?
Thank you!

 

[Petar]

Hi. 

Thank you for the shared example. We will check it and provide feedback about it at the beginning of the next week.

Thank you for your patience!

[Petar]

Hi.

As promised, I am replying back to this thread. 

To make the locked columns appear in the exported PDF file, you need to configure the PDFExport component as follows:

<pdfexport ref="gridPdfExport" :paper-size="'a4'">
.......

Here is an edited version of the project you sent us in which the above configuration is applied. 

Last but not least, I want to share with you that the Kendo UI for Vue is a commercial library that can be used only with a trial or commercial license.

I can see that you don't have any of the mentioned above licenses associated with your profile. Before we continue the discussion in the current thread, may I ask you to register for a trial license using the "Start free trial" button here? Thank you for your cooperation and understanding!

[Dev]

Hi, 
It cannot work. 

For example. If there are 13 columns in the grid, and you set the paper-size as 'a4'.
The width of a4 can't accommodate those columns. 

Here is an example.

Thank you.

[Petar]

Hi.

Thank you for the additional details about the discussed functionality. Based on the last information, I've logged this bug report on your behalf. 

I cannot say exactly when the bug will be fixed. What you can do is follow the above feedback portal item and once there is a change in its status you will receive a notification.

The possible workaround we can provide is demonstrated in this StackBlitz example. In this example we have the following method definition:

exportPDFWithComp: function () {
  const originalColumns = this.columns.slice();
  this.columns = originalColumns.map((el) => {
    return { ...el, locked: undefined };
  });
  this.$refs.gridPdfExport.save(this.products);
  this.columns = originalColumns;
}

In the above snippet, the code in green makes all Grid columns "unlocked" just before the PDF exporting. The snippet in yellow returns the original state of the columns. 

I've updated your Telerik points as a sign of gratitude for reporting the bug. Please check the example that contains the workaround and let me know if it helps you implement what you need in the application you are working on.

[Dev]

Yes, it woks.

Thank you!!

[Petar]

You are welcome!

I am happy to hear that the suggested approach works in your scenario.