elRTE

That would work but you have to remember that this inside prototype is elRTE object, not the editor itself. Try this:

1 elRTE.prototype.save = function () {
2    this.editor.hide();
3    this.editor.prev().show();
4 };

Awesome thanks Troex.
That worked perfectly.

One last question, how can I change the statusbar to prevent it from showing?

Thanks

Marcus

in elrte.css set:

1 .el-rte .statusbar {
2    display: none;
3 }

Sounds good, as it will be hidden from normal view.

But, is there any way to remove or change it programmitically?

1 elRTE.prototype.editor.statusbar = '';

Thanks again.

Marcus

There is no simple way, however you can do this to hide it in js:

 1 diff --git a/src/elrte/js/elRTE.js b/src/elrte/js/elRTE.js
 2 index 2b5f5b2..eec4c2a 100644
 3 --- a/src/elrte/js/elRTE.js
 4 +++ b/src/elrte/js/elRTE.js
 5 @@ -34,7 +34,7 @@ elRTE = function(target, opts) {
 6         this.workzone  = $('<div class="workzone"/>').append(this.iframe).append(this.source);
 7         this.statusbar = $('<div class="statusbar"/>');
 8         this.tabsbar   = $('<div class="tabsbar"/>');
 9 -       this.editor    = $('<div class="'+this.options.cssClass+'" />').append(this.toolbar).append(this.workzone).append(this.statusbar).ap
10 +       this.editor    = $('<div class="'+this.options.cssClass+'" />').append(this.toolbar).append(this.workzone).append(this.tabsbar);
11 
12         this.doc     = null;
13         this.$doc     = null;

You will also have to use src/ version or minimize it yourself

Thank you once again Troex.

I don't like to change the original source, only because it allows me to update, somewhat cleanly.

But I understand that not everything can be open and exposed to changes from outside the classes/functions.

I appreciate the code very much, although I figured I needed to do that.

:-)

Look forward to the next round of updates.

Marcus

Hello,
first of all sorry for my english

well I test elRTE (against CKeditor) and I modify save function in elrte.full.js, test it and it looks ok for my usage. But I prefer to not modify the original code so how can I use my code to overwrite the original save function?

is it possible to call a js file to do what I want?

for information:
my function ask a filename if input element with id=filename exist in form before post form else only post form.

this is my code:

/**
 * @class button - save as editor content (submit form)
 *
 * @param  elRTE  rte   
 * @param  String name  
 *
 * @author:    beemoon (based on Dmitry Levashov (dio) dio@std42.ru job)
 * @copyright: beemoon and Co, http://www.beemoon.fr
 **/
 (function($) {
elRTE.prototype.ui.prototype.buttons.save = function(rte, name) {
    this.constructor.prototype.constructor.call(this, rte, name);
    this.active = true;

    this.input = $('<input type="text" />').attr('name', 'save').attr('size', '16')
    var self = this;

    this.command = function() {
        var opts = {
            rtl : this.rte.rtl,
            submit : function(e, d) { e.stopPropagation(); e.preventDefault(); d.close(); self.set();  },
            dialog : {
                title : this.rte.i18n('Save as')
                }
            }

        this.rte.selection.saveIERange();

        if (window.document.getElementById('filename')){
            var filenameTmp=window.document.getElementById('filename').value;    
            if (filenameTmp==''){
                var d = new elDialogForm(opts);
            }else{
                this.rte.beforeSave();
                window.document.getElementById('form').submit();
            }
        }else{
            this.rte.save();
        }

        d.append([this.rte.i18n('File name : '), this.input], null, true).open();
        setTimeout(function() { self.input.focus()}, 20);
    }

    this.set = function() {
        var n = $.trim(this.input.val());
        if (n!=''){
            this.rte.beforeSave();
            window.document.getElementById('filename').value=n;
            window.document.getElementById('form').submit();
        } else {
            var _message = this.rte.i18n('You have to enter a filename');
            alert(_message);    
        }        
    }

    this.update = function() { }        
}
})(jQuery);

If you include your file (code) after elrte.min.js

elRTE.prototype.ui.prototype.buttons.save

nice That worked perfectly.

Hey guys!

First, I am a big fan of elRTE thus far; it's great to use.

The one issue I'm having is overriding the buttons in the toolbar, just as has been discussed in this thread. I am following the instructions mentioned above, but for some reason it seems as though the original code is still called.

Basically, I am trying to override the Save function and for some reason even after doing so, the form.Submit call is made from within the elRTE source. I have the elRTE.min.js included before my file, and there are no errors as far as I can tell. My code looks like this:

    $('#articleEditor').elrte({
        // allowSource: false,
        frmAllow: false,
        resizable: false,
        toolbars: { tgeToolbar: ['save', 'style', 'copypaste', 'indent', 'lists', 'links', 'media'] },
        toolbar: 'tgeToolbar',
        height: '350',
        cssfiles: ['/content/rte/rteInner.css'],
        denyTags: ['script', 'applet', 'base', 'basefont', 'bgsound', 'blink', 'body', 'col', 'colgroup', 'isindex', 'frameset', 'html', 'head', 'meta', 'marquee', 'noframes', 'noembed', 'o:p', 'title', 'xml'],
        pasteDenyAttr: ['id', 'name', 'class', 'style', 'language', 'onclick', 'ondblclick', 'onhover', 'onkeup', 'onkeydown', 'onkeypress']
    });

    elRTE.prototype.ui.prototype.buttons.save = function () {
        $('#saveMsg').attr('style', '').html('Saving article...');
        $('#loaderAnim').click();

        var articleTxt = $('#articleEditor').elrte('val');

        $.post('SaveText', { articleText: articleTxt }, function (res) {
            if (res.length > 0) {
                $('#saveMsg').attr('style', 'color:#F44E4B').html(res);
                setTimeout('closeDelay()', 3000);
            }
            else {
                $('#saveMsg').attr('style', 'color:#68AD48').html('Article saved successfully');
                setTimeout('closeDelay()', 1500);
            }
        });
    }

I've tried this, as well as overriding the "elRTE.prototype.save" call, but that didn't work either. What's odd is that with the code pasted above, it does seem to get called as my animation loader does appear, but the default method seems to get called as well, as the form.Submit() is getting executed.

Am I missing something? I just want the code I have to execute without the original "save" method getting called.

Thanks for your time!!

Best regards,

Josh

Hi,

Not related to the last post on this topic, but it is to do with the Save function.

I have a problem with the save button not to working in IE - the demo file attached will work perfectly in Firefox and Chrome but not in IE. As you can see I have stripped this back to the minimum, removed all code that I have written and used all the included files from elrte.org, but still its not working. Even more bizarre is if I chekc out the demo on the elrte websitem, the save function works!?

The IE version is 9.0.8112.16421

Help!!!

John

After a little while of troubleshooting and digging, I believe my problem was because the page was being loaded in an odd way, such that the appropriate overriding code didn't get called.

Sorry for the false alarm; everything seems good now!

Thanks!

The IE problem I raised above seems to be caused by the trim() function as reported elsewhere. I used the suggested patch of $.trim() and all works well now.

John

Hello, sorry for late reply, the override problem is really should be in the order, first you need to override and then only init elRTE.

We know about the trim problem, we've been fixing some bugs in last version and now it raises this problem, if you really get stuck, try to switch to older version.

Thanks for the reply!

I was eventually able to override the save option without an issue. However, when I try to override the image button, it doesn't seem to work. I've tried it this way:

elRTE.prototype.ui.prototype.buttons.image = function () {
                alert('it was presed');
            }

and this way:

elRTE.prototype.ui.prototype.buttons.image = function (rte, name) {
        this.constructor.prototype.constructor.call(this, rte, name);
        this.command = function () {
            alert('yo, image button pressed');
        };

        this.update = function () { };
        };

... both before and after the initialization of elRTE, and sadly neither seems to work. Do you have any ideas for what could be causing this?

Thanks again!!

Well, I take that back again... It seems to start working if I override both the "flash" and "image" buttons, but if I just do the image button it doesn't seem to work. Either way, i think I'm good to go now.

Thanks!!

In your case is better to create another button, because image/flash is a bit core-system related.