locked
Chrome ignores font-size in the htmleditor in the ajaxcontroltoolkit RRS feed

  • Question

  • User1886661451 posted

    I have a webpage that has a htmleditor provided by the Ajax Control Toolkit. It works good in IE. I've tried all the buttons, and the underlying text is neatly stored in the database, including the tags for bold, font-size etc.

    Now I've found out that Google Chrome works fine with bold for example, but completely ignores font-size or font-family.

    The moment I highlight a piece of text and choose an button, it is fine. The moment I save it, it is gone.

    By the way, font-size works fine in Firefox, font-family is also ignored.

    I really need to get this working. Anyone any ideas?

    Tuesday, February 14, 2017 11:00 AM

All replies

  • User-271186128 posted

    Hi EllenHeijmans,

    and the underlying text is neatly stored in the database, including the tags for bold, font-size etc.

    Does it also worked well in Chrome?

    If it is, I think the problem is how you display the text. 

    I’m using the following code. It is worked in Chrome.

    In aspx:

    <form id="form1" runat="server">
            <div>
                <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
                <asp:TextBox ID="TextBox1" TextMode="MultiLine" Columns="50" Rows="10" runat="server" />
                <ajaxToolkit:HtmlEditorExtender ID="HtmlEditorExtender1" TargetControlID="TextBox1" EnableSanitization="false" runat="server"></ajaxToolkit:HtmlEditorExtender>
            </div>
            <asp:Button runat="server" ID="Button1" OnClick="Button1_Click" />
            <asp:Label runat="server" ID="Label1" />
    </form>
    

    In behind code:

       protected void Button1_Click(object sender, EventArgs e)
            {
                var text1 = TextBox1.Text;
                Label1.Text = text1;
            }
    

    Best regards,
    Dillion

    Wednesday, February 15, 2017 6:28 AM
  • User1886661451 posted

    That;s because you set EnableSanitization to false. But if you do that, no content is checked. Leaving it open for malicious attacks and copied text from example Word.

    It's a bit strange that sanitation filters out function from the editor itself.

    Wednesday, February 15, 2017 10:18 AM
  • User-271186128 posted

    Hi EllenHeijmans,

    When the EnableSanitization is set to true. Only the size 7 is ignored in Chrome. Other style is fine.

    In IE the size 7 is saved as : “font size ="7""

    In Chrome size 7 is saved as : “font-size: xxx-large

    But it is should be : “font-size: -webkit-xxx-large

    That’s the reason why the font-size is ignored.

    Best Regards,
    Dillion

    Thursday, February 16, 2017 6:29 AM
  • User1886661451 posted

    Did you try to save the text? With a alert on client-side I can the spans Chrome creates, but the moment I get in my code behind, all the spans and so on are gone, leaving only plain text.

    Thursday, February 16, 2017 7:42 AM
  • User1886661451 posted

    Maybe it has something to do with the fact that the editor is doing some decoding behind the scene? Because when I, on client-side, with  jQuery, use the following command: $("#txtVoorlooptekst").text() all I get are the empty spans and the styles are gone.

    The code that Chrome generates is, style="font-family: &quot;times new roman&quot;, times, serif;" so I think that the middle &quot; are causing the problem. But since there are also legitime &quot in the text, I can't just filter them out.
    Mayb

    Thursday, February 16, 2017 7:56 AM
  • User-271186128 posted

    HI EllenHeijmans,

    so I think that the middle &quot; are causing the problem. But since there are also legitime &quot in the text, I can't just filter them out.

    I have made a test. when the  EnableSanitization is set to true, it will only remove the tags and the text in your tags.

    I have set font-family, background -color ,and put some tags in text.

     

    when I pass it to behind code, the text not in tags and the style are remained

     

    And it’s the result:

     

    I think the problem may caused by the Sanitizer.

    What’s your version?

    Mine AjaxControlToolkit and Sanitizer version is 16.1.1

    Best regards,
    Dilion

    Tuesday, February 21, 2017 7:07 AM
  • User1886661451 posted

    I've installed the latest version through the NuGet Package Manager Console in Visual Studio.

    But I've discovered that the problem is that Chrome translates a font to <span style=font-family... and IE as <font face=... And that a different font-size is <span style="font-size... in Chrome and <font size=... in IE. And indeed, extra quotes

    I've tried to make a sort of sanitizer myself as a workaround, but that takes to much time and needs a lot of testing.

    So I've decided to give up and buy a good editor.

    Wednesday, February 22, 2017 9:28 AM