Wizard PDF Export CSS

Forms
1

Hello!

I’m looking for some help finding the correct CSS to use so when I export a form to PDF, it will show the content from every section of the wizard.

Thanks in advance!

2

Dear Jeff,

Please, try the following CSS:

 .k-pdf-export .wizard-tab-container {
     display: block !important;
 }

The “k-pdf-export” class is only applied during the export process, so it should help to customize CSS at that precise moment.

3

Hi Alex,

This worked perfectly, thank you.

Sorry to bother you with another question but could you help me with hiding the wizard-nav during PDF export as well?

Thanks again

4

Dear Jeff,

Sure, just add this CSS rule:

.k-pdf-export .wizard-nav, .k-pdf-export .wizard-progress-bar,.k-pdf-export .wizard-header {
    display: none !important;
}
5

That worked. Thanks again!

6

Hi i have an attachment field which i want to hide just for exported pdf file and it not working i am using the following css code: I also tried giving css class to field and using that class both didnt work.

.k-pdf-export Attachment{ //Attachment is internal name
display:none ! important ;
}

7

its working now thank you

1 Like
8

Hi, thanks for this code, works perfectly for my form except Next, Back and Finish button. I tried to add in .k-pdf-export .wizard-footer but does not work. What is the correct code if I want to hide those button too.

Update: solution found already! I need to use wizard-card-footer instead of wizard-footer only.

.k-pdf-export .wizard-tab-container {
display: block !important;
}

.k-pdf-export .wizard-nav, .k-pdf-export .wizard-progress-bar, .k-pdf-export .wizard-header, .k-pdf-export .wizard-card-footer {
display: none !important;
}

2 Likes