n-number of elRTE instances

Added by Ted Taliaferro 6 months ago

I am having problems trying to retrieve the content from the editor for instances I created programmatically. I am grabbing a json feed and attaching an edit button for each element that will create an elRTE instance when clicked. I create a uniquely identified checkbox, div and button in jquery. When I create an instance and make a modification, I have an external Save button that grabs the content and send it to another page via ajax. The problem is that I cannot retrieve the content within the iFrame just the outerHTML (<iframe><textarea/></iframe>. Is it possible to have multiple editors and retrieve the content from the elements whose checkboxes are checked? Any help would be greatly appreciated.

Code

JQUERY

    function make_feed_item(item, item_id) {
          var content = item.content;
          var cateList = new Array();
          cateList = item.category;

          var core = '<div id="cid' + item_id + '" class="ui-widget-content ui-corner-all" style="position: relative;"><h3 class="ui-widget-header ui-corner-all" style="position: relative;" name=\"title_' + item_id + '\" id=\"title_' + item_id + '\">' + item.title +'</h3><div id="input_' + item_id + '"  name="q' + item_id + '_original">'+
          '<input type="checkbox" name="posts" value="' + item_id  + '\" /><a href="'+ item.link +'">' + item.title +'</a><br/><span name="content" id="content' + item_id + '">';
            //content displayed
            core += item["content:encoded"]+ "<input type=\"text\" value=\""+  cateList  + "\" name=\"category_" + item_id + "\" id=\"category_" + item_id + "\" class=\"textEntry\"/></span></div>"+
            "<button id=\"btnEdit'" + item_id + '\" onclick="openEditor(\'content' + item_id  + '\');">Edit</button> </div><br/>';

        return core;
    }
    var opts = {
        absoluteURLs: false,
        cssClass : 'el-rte',
        lang     : 'en',
        height   : 420,
        toolbar  : 'maxi',
        cssfiles : ['http://elrte.org/release/elrte/css/elrte-inner.css']
    }

    function openEditor(id)
    {
        var editor = new elRTE(document.getElementById(id), opts);
    }        

function savePost()
    {
        //...
        //collect innerHTML values

      $("input:checked").each(function(){ 
        markedDiv =  $("#pipes-feed-content").find('#input_' + $(this).val()); 
        parentDiv = $("#pipes-feed-content").find('#cid' + $(this).val()); 

        markup = $(markedDiv[0].outerHTML);
        bodyMarkup = $(parentDiv[0].outerHTML);

        //Get editor instance and content/val
        bodyContent = $('div.workzone', bodyMarkup);
        //tried this approach but did not work
        res = $('div.workzone').elrte('val');

        alert('bodyMarkup editor: ' + $('#input_0 div.workzone').elrte('val')); //only returns empty <iframe> tag
        //...
}        

HTML

...
<body>
    <button id="btnSaveTop">Save and Post</button>
    <div id="pipes-feed-content"></div> <!-- all the elements are loaded into this div
    <br/>
    <button id="btnSave">Save and Post</button>
</body>

Replies (1)

RE: n-number of elRTE instances - Added by Troex Nevelin 6 months ago

Please refer to this small doc JavaScript_API_EN - that should be enough to get what you need

(1-1/1)