Replace all textareas?

virgvv · 2005-03-17 03:09:41

Hi,
I was using HTMLArea 3, which was very buggy, and am hoping Xinha is an improvement.
One thing I don't see in the newbie documentation is how to replace all textareas in a document (I'm incorporating Xinha into a CMS/DB editor that gets the textarea names from the database fields).
Does HTMLArea.replaceAll() still work? If not, is there a Xinha equivalent, or a way to create one?
Thanks,
Virginia

niko · 2005-03-17 04:28:49

replaceAll does still exists in the code.
but i have never used it...
just give it a try!

gogo · 2005-03-19 01:32:44

virgvv wrote:

Hi,
I was using HTMLArea 3, which was very buggy, and am hoping Xinha is an improvement.
One thing I don't see in the newbie documentation is how to replace all textareas in a document (I'm incorporating Xinha into a CMS/DB editor that gets the textarea names from the database fields).
Does HTMLArea.replaceAll() still work? If not, is there a Xinha equivalent, or a way to create one?
Thanks,
Virginia

As niko says, replaceAll does still exist, theoretically it should work. But I've never used it. If you find it doesn't please ticket it.

You might however be better to follow the example (using the nightly build) and specify each area that should be replaced, as it's the "preferred" way of doing things.

willeffects · 2005-03-28 22:15:24

did anyone try this? Did it work?

foyleman · 2005-04-26 13:15:06

HTMLArea.replaceAll(xinha_config) does work, but it has some important flaws. Primarily, it cannot be used in conjunction with plugins... at least I can't get it to work with plugins. This is an important feature.

*edit... two posts down for info on how to implement*

For instance, in order to properly load the plugins, you need to run two functions:
- loadPlugins() : this runs just fine
- HTMLArea.makeEditors(xinha_editors, xinha_config, xinha_plugins) : this cannot work

HTMLArea.makeEditors(xinha_editors, xinha_config, xinha_plugins) requires 3 variables to be defined. The first variable is the ID of the textarea that you want to edit. If you are using replcaeAll, then you either don't know the available ID's or (as in my case) you are using it within a template where the ID changes based on the page that is loaded. Therefore, while you can load the plugins, you cannot activate them.

To better explain...
I am using a CMS. This means that I use the same page header and footer (theme) for every page that is loaded. It's just the content in the middle that changes with each page which is built dynamically. Those pages that have a textarea, refer to different textarea names and ids, depending on the data that has been dynamically created. A News page may have 3 textarea while a Downloads page may only have one.
With this editor, if you define an ID that doesn't exist, you get a javascript error/warning. This doesn't happen with replaceAll because the IDs are collected from the page at the time of load.

If anyone has a solution to this problem, it would be great. Otherwise I either have to live without plugins or I will have to create something for this php cms that defines and inserts the necessary code at the time the pages load.

Those of you interested in playing with it:

*edit... two posts down for info on how to implement*

Last edited by foyleman (2005-04-26 15:12:39)

niko · 2005-04-26 13:54:28

...if you don't know the IDs of the textareas you can easy get them using this:

var textareas = document.getElementyByTagName('textarea');
var xinha_editors = new Array();
for(var i in textareas) {
   if(textareas[i].id) {
      xinha_editors.push(textareas[i].id);
   }
}

(caution: untested code)

foyleman · 2005-04-26 15:11:16

Thanks niko. You pointed me in the right direction.
I know my PHP but I am quite the novice with JavaScript

For those of you wanting the advantage of replaceAll() with all the features of xinha:

make sure that you have some ID, any ID specified within each of your textarea tags. Then...

within your <head>

<script type="text/javascript">
    _editor_url = "HTMLArea/";
    _editor_lang = "en";
</script>

<script type="text/javascript" src="HTMLArea/htmlarea.js"></script>
<script type="text/javascript" src="HTMLArea/my_config.js"></script>

within your my_config.js

xinha_editors = null;
xinha_init    = null;
xinha_config  = null;
xinha_plugins = null;

xinha_init = xinha_init ? xinha_init : function()
{
    /** List The Plugins ****************************************************/

    xinha_plugins = xinha_plugins ? xinha_plugins :
    [
     'CharacterMap',
     'ContextMenu',
     'FullScreen',
     'ListType',
     'SpellChecker',
     'SuperClean',
     'TableOperations',
     'InsertAnchor',
     'Linker'
    ];
    if(!HTMLArea.loadPlugins(xinha_plugins, xinha_init)) return;

    /** List textareas Dynamically ******************************************/

    var textareas = document.getElementsByTagName('textarea');
    var xinha_editors = new Array();
    for(var i in textareas) {
       if(textareas[i].id) {
      xinha_editors.push(textareas[i].id);
       }
    }

    /** Customize Your Menu *************************************************/

    xinha_config = xinha_config ? xinha_config : new HTMLArea.Config();

    xinha_config.width  = 400;
//    xinha_config.height = 200;

    xinha_config.toolbar =
    [
        ["formatblock","fontname","fontsize","bold","italic","underline","strikethrough"],
        ["linebreak"],
        ["subscript","superscript","separator"],
        ["justifyleft","justifycenter","justifyright","justifyfull","separator"],
        ["insertorderedlist","insertunorderedlist","outdent","indent","separator"],
        ["inserthorizontalrule","createlink","insertimage","separator"],
        ["forecolor","hilitecolor","textindicator"],
        ["linebreak"],
        ["inserttable","separator","undo","redo"], (HTMLArea.is_gecko ? [] : ["cut","copy","paste"]),["separator"],
        ["killword","removeformat","toggleborders","lefttoright", "righttoleft", "separator","metadescr","htmlmode"]
    ];

    xinha_config.registerButton('metadescr', 'Force Meta Description', 'HTMLArea/images/ed_metadescr.gif', false, function(editor) {editor.surroundHTML('<!-- STARTDESCR -->', '<!-- ENDDESCR -->');});

    this.fontname = {
        "&mdash; font &mdash;":         '',
        "Arial":       'arial,helvetica,sans-serif',
        "Courier New":       'courier new,courier,monospace',
        "Georgia":       'georgia,times new roman,times,serif',
        "Tahoma":       'tahoma,arial,helvetica,sans-serif',
        "Times New Roman": 'times new roman,times,serif',
        "Verdana":       'verdana,arial,helvetica,sans-serif'
    };

    xinha_config.formatblock = {
        "&mdash; format &mdash;"  : "",
        "Heading 1": "h1",
        "Heading 2": "h2",
        "Heading 3": "h3",
        "Heading 4": "h4",
        "Heading 5": "h5",
        "Heading 6": "h6",
        "Normal"   : "p",
        "Formatted": "pre"
    };

    /** Create The Editors **************************************************/

    xinha_editors   = HTMLArea.makeEditors(xinha_editors, xinha_config, xinha_plugins);

    /** Start The Editors **************************************************/

    HTMLArea.startEditors(xinha_editors);
}

window.onload = xinha_init;

Last edited by foyleman (2005-04-26 15:37:07)

niko · 2005-04-27 01:30:11

nice,

we could place this somewhere in the newbie guide (or a link in the newbie guide)

willeffects · 2005-04-29 01:29:10

Is there a button you use for it? Am I missing how you actually execute it?

Thanks,
Will

foyleman · 2005-04-29 08:19:21

Everything is there. It should automatically load with the page.

1. Make sure that all of your textarea tags have unique ID's specified. They don't have to correlate to anything, they just need to be there for this system to work.

2. insert the specified code in the <head> of your page. This loads the editor (as saved in /HTMLArea/) and also loads your configuration files.

3. insert the specified code in the my_config.php file. This loads the configuration for the textarea editors. This portion:

    var textareas = document.getElementsByTagName('textarea');
    var xinha_editors = new Array();
    for(var i in textareas) {
       if(textareas[i].id) {
      xinha_editors.push(textareas[i].id);
       }
    }

automatically grabs all the ID's from the textareas on your page and inserts the editor into those. The last line on the page launches it all.

Last edited by foyleman (2005-04-29 08:20:56)

herr.vorragend · 2006-05-04 09:06:16

I have one problem.

Your code is very usefull.
But on my page there are two textarea, which should not be user with xinha.

The following textareas are dynamic.
I can insert new textareas if I want.

Normally there is just one textarea:

- newtext0

If I need more space I insert further textarea:
-newtext1
-newtext2
-newtext3
-newtext4

These should be user with xinha.

But two (always the same ID) textarea shoudl be excluded:
- newingress
- newrelatedlinks

Any idea?

Thank you.

steveo125 · 2006-05-04 09:35:37

You just need to add a few bits to foylemans code

    var textareas = document.getElementsByTagName('textarea');
    var xinha_editors = new Array();
    for(var i in textareas) {
       if(textareas[i].id && textareas[i].id != 'newingress' && textareas[i].id != 'newrelatedlinks') {
      xinha_editors.push(textareas[i].id);
       }
    }

That's the quick way. But a more future proof method might be to look at another attribute like the class.
<textarea id="newrelatedlinks" class="noxinha"></textarea>

    var textareas = document.getElementsByTagName('textarea');
    var xinha_editors = new Array();
    for(var i in textareas) {
       if(textareas[i].id && textareas[i].className != 'noxinha') {
      xinha_editors.push(textareas[i].id);
       }
    }

Then you can have as many textareas as you like which do or don't have xinha depending upon the class

Last edited by steveo125 (2006-05-04 09:36:25)

herr.vorragend · 2006-05-04 09:41:23

Perfect.
It works.

I can't use the class-method, because the form-tags are generated with a cms-plugin.
It would be a lot of work to "hack" the php-files each update.

Thanx-a-lot for help

hilope · 2007-01-29 00:00:20

This code doesn't seem to work anymore in xinha (rev647).

Has anybody an idea what i can do to get all textareas into xinha-areas???

ray · 2007-01-29 08:27:55

Well, from a quick look I don't see why it shouldn't have stopped working.

Please give more information, an URL to have a look at might help solve the problem quickly.

hilope · 2007-01-29 19:55:23

Oh, my fault ... everything okay

I changed some other settings, so it seems that this was not the error.

Thanks.

hilope · 2007-02-01 00:11:28

So, perhaps someone can explain how can i use getHTML with all textareas.
I use xinha as an integration in an application, where a onsubmit-function exists i can use for that.

My javascript is only minmal, so i need a for-script to get all converted textareas back with getHTML .... at the moment content isn't get updated

Last edited by hilope (2007-02-01 00:12:03)

ray · 2007-02-01 07:13:50

var xinhas = __xinhas; // or __htmlareas in loder versions
for (var i=0;i<xinhas.length;i++)
{
  xinhas[i]._textArea.value = xinhas[i].outwardHtml(xinhas[i].getHTML());
}

hilope · 2007-02-01 20:30:37

Working fine after correcting some variable declarations in my scripts (global / local).

Thanks a lot for your help. This makes a lot of people happy

Xinha Discussion Forum

Announcement

#1 2005-03-17 03:09:41

Replace all textareas?

#2 2005-03-17 04:28:49

Re: Replace all textareas?

#3 2005-03-19 01:32:44

Re: Replace all textareas?

#4 2005-03-28 22:15:24

Re: Replace all textareas?

#5 2005-04-26 13:15:06

Re: Replace all textareas?

#6 2005-04-26 13:54:28

Re: Replace all textareas?

#7 2005-04-26 15:11:16

Re: Replace all textareas?

#8 2005-04-27 01:30:11

Re: Replace all textareas?

#9 2005-04-29 01:29:10

Re: Replace all textareas?

#10 2005-04-29 08:19:21

Re: Replace all textareas?

#11 2006-05-04 09:06:16

Re: Replace all textareas?

#12 2006-05-04 09:35:37

Re: Replace all textareas?

#13 2006-05-04 09:41:23

Re: Replace all textareas?

#14 2007-01-29 00:00:20

Re: Replace all textareas?

#15 2007-01-29 08:27:55

Re: Replace all textareas?

#16 2007-01-29 19:55:23

Re: Replace all textareas?

#17 2007-02-01 00:11:28

Re: Replace all textareas?

#18 2007-02-01 07:13:50

Re: Replace all textareas?

#19 2007-02-01 20:30:37

Re: Replace all textareas?

Board footer