How to move caret to end of editor

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

    Posted 11 Jul Link to this post

    How do we move the cursor position to the end of the editor after changing its HTML content? Sometimes after setting editor.value("some new html string") I get the cursor position reset to the start of the text in the editor box, I'll like to have it at the end of the text in the editor box so that the user can continue typing, I can't seem to find any example in the demos, can someone guide me on this? Thank you.
  2. Nikolay
    Admin
    Nikolay avatar
    64 posts

    Posted 12 Jul Link to this post

    Hi,

    Here is a sample dojo which shows changing editor's content and moving the cursor at the end of the content area (http://dojo.telerik.com/ApIFO/3).

    You can also review the following articles about using range object:
    Regards,
    Nikolay
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Kendo UI is VS 2017 Ready
  4. Joey
    Joey avatar
    5 posts
    Member since:
    Jul 2016

    Posted 13 Jul Link to this post

    Hi Nikolay, thanks for the dojo sample. It works in IE and Chrome, but there seems to be a bug in firefox. Pressing space before moving the cursor seems to add an unintended line break each time.

    Please see the following screen cast:

    http://screencast.com/t/q70wk0wY7Z

     

  5. Nikolay
    Admin
    Nikolay avatar
    64 posts

    Posted 14 Jul Link to this post

    Hi,

    Firefox adds a line break when space key has pressed (http://screencast.com/t/mexAfzImIVHU) and editor.value() returns the HTML along with the BR. The editor does not have custom logic for space key and leave it to the browser.

    To resolve the issue, you can strip the line break before changing the editor content using regular expression. Another approach is to handle keydown/up events and remove the BR if it is not added by the user or implement adding of a space on keydown and cancel the event.

    You can review the editor methods and events here (http://docs.telerik.com/kendo-ui/api/javascript/ui/editor).

    Regards,
    Nikolay
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
Back to Top
Kendo UI is VS 2017 Ready