Bring back elRTE after destroy...

Added by Aleksandr G about 2 years ago

Just went through forum and Google and still
cannot find how to bring editor back after destroying.

I have an image which launches elRTE onclick:

        <img src='images/edit.png' width='25' height='25' class='editorlaunch' />

        $('.editorlaunch').live('click', function() {
        $('.editorlaunch').hide();
        $('.content').elrte(opts);
    });

Handler which destroys elRTE:

    elRTE.prototype.save = function() {
        $('.content').elrte('destroy');
        $('.editorlaunch').show();
    };

When I click on image again - editor does NOT show up.
No JS errors.

Please help.


Replies (5)

RE: Bring back elRTE after destroy... - Added by Troex Nevelin about 2 years ago

Check that $('.content') isn't destroyed at all, maybe elrte deletes the node, so you need to recreate it again

RE: Bring back elRTE after destroy... - Added by Aleksandr G about 2 years ago

Firebug shows that .content element exists with elRTE added display:block.
DOM has elRTE function as well.

<div class="content" style="display: block;">
test
</div>

Still not sure what else to do.
Probably bug?

RE: Bring back elRTE after destroy... - Added by Troex Nevelin about 2 years ago

Probably yes, we haven't set destroy callback too much. Sorry I can't give you direct answer

RE: Bring back elRTE after destroy... - Added by Aleksandr G about 2 years ago

Here is a simple html to re-create the problem:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>some</title>
<link rel='stylesheet' href='styles/jquery-ui.custom.css' type='text/css' media='screen' charset='utf-8' />
<link rel='stylesheet' href='styles/elrte.min.css' type='text/css' media='screen' charset='utf-8' />
<script src='js/jquery.min.js' type='text/javascript'></script>
<script src='js/jquery-ui-custom.min.js' type='text/javascript' charset='utf-8'></script>
<script src='js/elrte.min.js' type='text/javascript' charset='utf-8'></script>
<script src='js/i18n/elrte.ru.js' type='text/javascript' charset='utf-8'></script>
<script type='text/javascript'>
    $(document).ready(function() {
        var opts = {
            cssClass : 'el-rte',
            lang     : 'ru',
            toolbar  : 'complete',
            cssfiles : ['styles/elrte-inner.css'],
            styleWithCSS: true,
            toolbar: 'maxi'
        }

        $('.editorlaunch').live('click', function() {
            $('.editorlaunch').hide();
            $('.content').elrte(opts);
        });

        elRTE.prototype.save = function() {
            $('.content').elrte('destroy');
            $('.editorlaunch').show();
            $('.editorlaunch').append('(will not work)');
        };

    });
</script>
</head>
<body>
<div class="container">
  <div class="content">
    test <button class='editorlaunch'>edit</button>
  </div>
</div>
</body>
</html>

RE: Bring back elRTE after destroy... - Added by Corb C over 1 year ago

I'll admit this a bit hacky but it seems to work. I'm not sure what impact this would have on the DOM if it gets used a lot.

var opts = {
lang: 'en',
absoluteURLs: false,
cssClass : 'el-rte',
lang : 'en',
height : 420,
allowSource: false}
elRTE.prototype.save = function() {
var ntxt = $('#editor').elrte('val');
$('#editor').html(ntxt).elrte('hide').show();
};
$('#editor').elrte(opts).hide().elrte('show');

(1-5/5)