HTML css function is not working in Telerik Reporting of HTML text box

[Moe]

Hi Support,

I want to know how to do Telerik Reporting of HTML Text box read css function. Now I added css function and then html textbox is not working.

If I add below text in to html text box of reporting but not working.

<title>Untitled</title><style type="text/css">p { margin-top: 0px;margin-bottom: 0px;line-height: 1.15; } body { font-family: 'Verdana';font-style: Normal;font-weight: normal;font-size: 16px; } .Normal { telerik-style-type: paragraph;telerik-style-name: Normal;border-collapse: collapse; } .TableNormal { telerik-style-type: table;telerik-style-name: TableNormal;border-collapse: collapse; } .NormalWeb { telerik-style-type: paragraph;telerik-style-name: NormalWeb;margin-top: 6.66px;margin-bottom: 6.66px;border-collapse: collapse; } .s_22077F37 { telerik-style-type: local;font-family: 'Microsoft YaHei';font-size: 16px; } .s_2C3B84B0 { telerik-style-type: local;font-family: 'Times New Roman';font-size: 16px; } </style><p class="NormalWeb "><span class="s_22077F37">Testing and Testing.</span><span class="s_2C3B84B0"></span></p>

 

 

If html textbox can't read and can't do your side also, how to remove css logic in HTMLEditControl. I read from there and I use telerik report that html. If I do myself remove css logic in html , reporting no issue. Please advise to me how to do . Now I am using HTMLEditControl and Telerik REport of html text box.

 

Thanks,

Moe

[Momchil]

Hello Moe,

Unfortunately, the HTML Text Box respects only inline styles, as described in the HTML Text Box Known Limitations article.

Therefore, in order to achieve the desired result, you can add the CSS attributes to the style attribute of the HTML elements. For example:

<span style='font-family:"Microsoft YaHei"; font-size:16px;'>Testing and Testing.</span>

The following documentation article lists the CSS attributes, supported by the HTML TextBox.

Styling and Formatting the HtmlTextBox Report Item - Telerik Reporting

I hope this answers your question. Let me know if I can assist you further.

Best Regards,
Momchil
Progress Telerik

[Moe]

HI Momchil,

 

I created button to open HTMLEditControl Form. I pass below coding.

 

  Private Sub BtnIntroductionParagraphEdit_Click(sender As Object, e As EventArgs) Handles BtnIntroductionParagraphEdit.Click
            Using FrmHTMLEditor As New FrmHTMLEditor
                Dim htmlFormatProvider1 As New HtmlFormatProvider

                FrmHTMLEditor.HtmlText = htmlFormatProvider1.Export(RichTextBoxNoticeIntro.Document)


                FrmHTMLEditor.Text = "Close this form to save changes"
                FrmHTMLEditor.ShowDialog()

                RichTextBoxNoticeIntro.Document = htmlFormatProvider1.Import(FrmHTMLEditor.HtmlText)
                Me.StrIntroParagraph = FrmHTMLEditor.HtmlText
            End Using
    End Sub

Screen of FrmHTMLEditor

Below coding for FrmHTMLEditor

Public Class FrmHTMLEditor
    Property HtmlText As String
    Property oEdit As HTMLEditControl
    Private Sub FrmHTMLEditor_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        Try
            oEdit = New Zoople.HTMLEditControl With {
                    .Dock = DockStyle.Fill,
                    .DocumentHTML = HtmlText,
                    .LicenceKey = "YourLicenseKey",
                    .LicenceKeyInlineSpelling = "InlineSpellingLicenseKey",
                    .EnableInlineSpelling = False,
                    .AlwaysConvertNonASCIIChars = False,
                    .CleanMSWordHTMLOnPaste = True,
                    .FontSizesList = "8pt;10pt;12pt;16pt;22pt;"
                    }
            Controls.Add(oEdit)
        Catch ex As Exception
            ClientLog.Insert(ex, Me.Name & ".FrmHTMLEditor_Load []")

            ClientLog.MessageToUser_ErrorProcessName("Load")
        End Try
    End Sub

    Private Sub FrmHTMLEditor_FormClosed(sender As Object, e As FormClosedEventArgs) Handles MyBase.FormClosed
        Try
            Me.HtmlText = oEdit.DocumentHTML

        Catch ex As Exception
            ClientLog.Insert(ex, Me.Name & ".FrmHTMLEditor_FormClosed []")

            ClientLog.MessageToUser_ErrorProcessName("Closed")
        End Try
    End Sub
End Class

After loading oEdit.DocumentHTML already included css function in below coding.

 

<title>Untitled</title><style type="text/css">p { margin-top: 0px;margin-bottom: 0px;line-height: 1.15; } body { font-family: 'Verdana';font-style: Normal;font-weight: normal;font-size: 16px; } .Normal { telerik-style-type: paragraph;telerik-style-name: Normal;border-collapse: collapse; } .TableNormal { telerik-style-type: table;telerik-style-name: TableNormal;border-collapse: collapse; } .NormalWeb { telerik-style-type: paragraph;telerik-style-name: NormalWeb;margin-top: 6.66px;margin-bottom: 6.66px;border-collapse: collapse; } .s_22077F37 { telerik-style-type: local;font-family: 'Microsoft YaHei';font-size: 16px; } .s_2C3B84B0 { telerik-style-type: local;font-family: 'Times New Roman';font-size: 16px; } </style><p class="NormalWeb "><span class="s_22077F37">Testing and Testing.</span><span class="s_2C3B84B0"></span></p>

 

 

How to remove css function? I want below coding after FrmHTMLEditor close pass to main form.

 

<span style='font-family:"Microsoft YaHei"; font-size:16px;'>Testing and Testing.</span>

 

Please tell me how to do convert inline styles?

 

Thanks,

Moe

 

 

 

                      

[Momchil]

Hello Moe,

If I am understanding correctly, you want the HTML that is returned from the editor not to include any CSS in "<style>" elements but instead to inline the CSS, as the Telerik Reporting HtmlTextBox supports only inline styles.

To achieve that you, can change the settings of the HtmlFormatProvider. For example, you can try setting the StylesExportMode of the provider to Inline, and specify which properties you would like to ignore using the PropertiesToIgnore option.

[Moe]

HI Momchil,

I didn't see StylesExportMode in HTMLFormatProvider. Actually, I want to change setting of  HTMLEditControl. Because DocumentHTML return included < type="text/css">. I don't like that. I want style='font-family:"Microsoft YaHei"; font-size:16px;'.

THanks,

Moe

[Dess | Tech Support Engineer, Principal]

Hi, Moe,

Please have a look at the following code snippet demonstrating how to access the StylesExportMode option:

            Telerik.WinForms.Documents.FormatProviders.Html.HtmlFormatProvider provider = new Telerik.WinForms.Documents.FormatProviders.Html.HtmlFormatProvider();
            provider.ExportSettings.StylesExportMode = Telerik.WinForms.Documents.FormatProviders.Html.StylesExportMode.Inline;

I hope this information helps.