Populating Editor via Jquery

3 posts, 1 answers
  1. Logan
    Logan avatar
    3 posts
    Member since:
    Dec 2016

    Posted 28 Sep Link to this post

    I am able to populate Editor programmatically from my model using Alexander's code snippet from http://www.telerik.com/forums/how-do-i-set-the-value-to-a-model-value-in-a-template-7d3339946e0d.

    However, when I try to populate editor using an Ajax call (based on a selection in a dropdownlist), then it stops working.  I can see the correct values are being returned and my other bound fields are populating correctly, just not the Editor textarea.

    My editor:

    @(Html.Kendo().EditorFor(m => m.Content)
          .Name("Content")
          .HtmlAttributes(new { style = "height:650px", aria_label = "editor" })
     )

    and my Jquery:

    $(function () {
            $('#Name').change(function () {
                var name = $(this).val();
     
                var success = function (results) {
                    debugger;
                    $('#Id').val(results.Id);
                    $('#Name').val(results.Name);
                    $('#NewName').val(results.Name);
                    $('#Content').val(results.Content);
                };
     
                $.ajax({
                    url: '/Staff/Email/GetEmail',
                    type: 'POST',
                    data: {
                        name: name
                    },
                    dataType: 'json',
                    success: success
                });
            });
        });

     

    The textarea has an id of 'Content', so why can't I set it's value using Jquery?

     

    Thank you in advance,

    Laura

  2. Answer
    Ianko
    Admin
    Ianko avatar
    1741 posts

    Posted 29 Sep Link to this post

    Hello Logan,

     

    That is because after the Kendo Editor is initialized the only purpose of this textarea is to populate the text in it, but not to read the text from it anymore. 

     

    The content of the Editor should be changed inside the editable iframe generated. Or, it would be much easier for you to use the API and the value() method of the Kendo Editor for that.

     

    $('#Content').data('kendoEditor').value(results.Content);

     

    Regards,
    Ianko
    Progress Telerik
    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.
  3. Logan
    Logan avatar
    3 posts
    Member since:
    Dec 2016

    Posted 29 Sep in reply to Ianko Link to this post

    Thank you, Ianko.  That worked perfectly!
Back to Top