Wizard PDF Export CSS

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!

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.

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

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;
}

That worked. Thanks again!

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 ;
}

its working now thank you

1 Like

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;
}

1 Like