BuyLog In
Ticket T954837
Visible to All Users

HtmlEditor - How to define a prefix for a link

created 4 years ago

Hi

How can I default prefix a link with 'https://' that is added with the HTML editor?

Kind regards
Piet

Sign in to comment on this post

Answers approved by DevExpress Support

created 4 years ago

Hello,

As far as I understand, you want to prefix a link if a user simply enters www.somelink.com instead of https://www.somelink.com. You can override the link format using the techniques described in the Customize built-in formats and modules article.

The snippet below modifies the sanitize method to add the prefix. This method allows you to check URLs before a link is applied in the element's href attribute.

JavaScript
onInitialized (e) {
    const htmlEditor = e.component;
    const Link = htmlEditor.get("formats/link");
    class PrefixLink extends Link {
        static sanitize(url) {
            return super.sanitize(url, this.PROTOCOL_WHITELIST) ? (url.includes('https://') ? url : `https://${url}`) : this.SANITIZED_URL;
        }
    }
    htmlEditor.register({ "formats/link": PrefixLink });
}

I created a snippet from our demo to demonstrate the solution.

Let us know if you have further questions.

    Comments (3)
    P P
    Piet 4 years ago

      Okay, thank you!

      DevExpress Support Team 4 years ago

        You're welcome!

        Would you mind if we mark this ticket as public? It will allow other customers to find this ticket if they have a similar task.

        P P
        Piet 4 years ago

          Okay, no problem.

          Sign in to comment on this post

          Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

          Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.