Set focus and move to end of kendo editor content

2 posts, 0 answers
  1. Vivekkumar
    Vivekkumar avatar
    3 posts
    Member since:
    Nov 2015

    Posted 25 Nov 2015 Link to this post

    So, I have to add <br\> at end of the kendo editor content and move focus at last line. To achieve this I have added following code:

     @(Html.Kendo().EditorFor(model => model.PageContent)
                    .Encode(false)
                    .Tools(i=>i.CustomButton(cb=>cb.Name("CustomTool").ToolTip("Add New line at end").Exec(@<text>
                                                    function(e)
                                                    {
                                                      var editor = $(this).data("kendoEditor");
                                                        var getCurrentContent = editor.value();
                                                        editor.value(getCurrentContent+'<br\>');
                                                        editor.focus();
                                                        var range = editor.createRange();
                                                        range.selectNodeContents(editor.body);
                                                        range.collapse(false);
                                                        editor.selectRange(range);
                                                    }  
                                                  </text>)))

     I am not able to move focus to end line of the content. Any suggestion would be helpful. Thanks.

  2. Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 26 Nov 2015 Link to this post

    Hello,

    By selecting the entire editor.body element the cursor will appear at the beginning of content area.

    You should rather select the <br> tag that is being added programmatically.  

    Here you are a possible approach for that—http://dojo.telerik.com/afInA/6. You can further improve it as per to your needs. 

    Regards,
    Ianko
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
Back to Top