Auto converting hyperlinks on the fly

6 posts, 0 answers
  1. Joey
    Joey avatar
    5 posts
    Member since:
    Jul 2016

    Posted 11 Jul 2016 Link to this post

    I have a requirement to detect and generate hyperlinks when the user keys in a url into the editor when not using Internet Explorer. Internet Explorer already has this inbuilt function to automatically convert hyperlinks, but firefox and other browsers don't.

    Using the linkifyjs plugin from soapbox I'm able to get this done easily via the keyup event in Editor (calling the linkify html function on the entire editor.value() html whenever the user types in a letter), but there is a problem,  anything the user types after the url becomes part of the url text. It's like the cursor gets permanently stuck in the text part of the url <a href="some.url.com">I think this is where the cursor is stuck in</a>

     

    1) Is there a method to call to exit the hyperlink and put the cursor gracefully after </a>?

    2) I tried adding an &nbsp; at the back of the editor.value() to try to re-position the cursor, but it seems the editor strips it automatically, why is that the case?

    3) Is there a better way to do this?

  2. Ianko
    Admin
    Ianko avatar
    1659 posts

    Posted 13 Jul 2016 Link to this post

    Hi,

    Kendo Editor provides automatic link generation similar to the IE's one. You can see this demonstration here: http://screencast.com/t/ozjzi8Mbz4. I suggest you to use the built-in one instead of the logic with the linkifyjs.

    Regards,
    Ianko
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Joey
    Joey avatar
    5 posts
    Member since:
    Jul 2016

    Posted 13 Jul 2016 in reply to Ianko Link to this post

    Hi Ianko, thanks for the screencast again. Unfortunately, it doesn't work in firefox. I've tried chrome and IE, it works fine, but in firefox, nothing happens. Please see the screen cast here.

     

    http://screencast.com/t/pa7t3u2eamCo

  4. Ianko
    Admin
    Ianko avatar
    1659 posts

    Posted 14 Jul 2016 Link to this post

    Hello Joey,

    Indeed, this is a bug only for Firefox. I have logged it in our backlog and you can monitor it via this Github issue: https://github.com/telerik/kendo-ui-core/issues/1933.

    For the time being only the Enter key will properly produce the links generated from the auto-link feature.

    Regards,
    Ianko
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  5. Wes
    Wes avatar
    5 posts
    Member since:
    Aug 2016

    Posted 15 Dec 2016 in reply to Ianko Link to this post

    Is there a chance you have a demonstration that doesn't require the Flash plugin? We aren't allowed to have that installed at work.
  6. Ianko
    Admin
    Ianko avatar
    1659 posts

    Posted 16 Dec 2016 Link to this post

    Hello Wes,

    If you need to test out the autolink feature, you can use the online demo: http://demos.telerik.com/kendo-ui/editor/index. Basically, type a link and press space or enter (check out the gif attached).  

    Regards,
    Ianko
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top