htmlArea

A directory of browser-based WYSIWYG editors

  MAIN
INDEX
SEARCH
POSTS
WHO'S
ONLINE
LOG
IN

Home: htmlArea 2: htmlArea 2 & 3 archive (read only): htmlArea v2.0:
2 different htmlareas on one page


The htmlArea 2 & 3 editors have been discontinued.

We've made these forums available as a read-only reference and knowledge-base for people using or developing editors based on htmlArea 2 or 3.

Anyone who is interested in taking over version 2 or 3 is free to do so. All we ask is that you choose a new name that doesn't have "htmlarea" in it to avoid confusion with this site. We'll even give you a link in the directory to make it easier for people to find you. If you are developing or hosting an htmlArea based-editor under a new name, please submit it to our directory.

 


vdanvoye
New User

Jul 17, 2003, 7:18 AM

Post #1 of 4 (2287 views)
Shortcut
2 different htmlareas on one page Can't Post

Is it possible to have 2 different htmlareas on the same page, i.e. 2 htmlareas with different buttons? The first one should have all the editing functions, the second one, only two or three...

Thanks for any input!



Vincent


Ericka
Novice

Jul 23, 2003, 4:46 PM

Post #2 of 4 (2193 views)
Shortcut
Re: [vdanvoye] 2 different htmlareas on one page [In reply to] Can't Post

[reply]
I also have this dilemma. Shall I copy the editor.js and rename the file & directories (i.e. editor2.js) and then reference the two diffrerent js editor files for each text area? Maybe this would work for me if I can only figure out how to use the "toolbar.config". I placed it in the header of my page and deleted the tools I did not want but got errors when I checked my work. AAAAHHH...please help!

-Ericka


Ericka
Novice

Jul 23, 2003, 5:26 PM

Post #3 of 4 (2187 views)
Shortcut
Re: [vdanvoye] 2 different htmlareas on one page [In reply to] Can't Post

Hi Vincent,

yes I figured out how to have two different HTML text areas and have different buttons display for each. Place both text areas on one page then name them different names (i.e. "textarea1", and "textarea2") then below each text area you include the javascript necessary to generate the wysiwyg. like this;

<textarea name="textarea1" style="width:800; height:150" rows="1" cols="20">
</textarea>

<script language="JavaScript1.2" defer>
var config = new Object(); // create new config object

// Add additional editor config settings here...
config.toolbar = [
['fontname'],
['fontsize'],
['fontstyle'],
['linebreak'],
['bold','italic','underline','separator'],
['strikethrough','subscript','superscript','separator'],
['justifyleft','justifycenter','justifyright','separator'],
['OrderedList','UnOrderedList','Outdent','Indent','separator'],
// ['forecolor','backcolor','separator'], // I didn't want these buttons in my first text area
//['custom1','custom2','custom3','separator'],
['Createlink'],
// ['about','help']
];

editor_generate('textarea1',config);
</script>

Then you do the same for your second text area and call it:
name="textarea2"
make sure you also place in the editor_generate('textarea2',config)


esthera
User

Nov 27, 2004, 12:36 PM

Post #4 of 4 (1766 views)
Shortcut
Re: [Ericka] 2 different htmlareas on one page [In reply to] Can't Post

hi can you help me-- I did as you wrote and I get document.all is null or not an object?

I want 2 textareas with htmlarea on one page.



Here's my code:


Code
 <tr><td>Intro Text</td><td><textarea cols="50" rows="5" name="introtext"></textarea><script language="javascript1.2" defer> 
var config = new Object(); // create new config objectconfig.width = "90%";
config.height = "200px";
config.bodyStyle = 'background-color: white; font-family: "Verdana"; font-size: x-small;';
config.debug = 0;// NOTE: You can remove any of these blocks and use the default config!config.toolbar = [
//['fontname'],
//['fontsize'],
//['fontstyle'],
// ['linebreak'],
['bold','italic','underline','separator'],
['strikethrough','subscript','superscript','separator'],
['justifyleft','justifycenter','justifyright','separator'],
['OrderedList','UnOrderedList','Outdent','Indent','separator'],
// ['forecolor','backcolor','separator'],
// ['HorizontalRule','Createlink','InsertImage','htmlmode','separator'],
// ['about','help','popupeditor'],
];editor_generate('introtext',config);</script></td></tr>
<tr><td>Main Text</td><td><textarea cols="50" rows="10" name="text"></textarea></td></tr>
<script language="javascript1.2">
var config = new Object(); // create new config objectconfig.width = "90%";
config.height = "200px";
config.bodyStyle = 'background-color: white; font-family: "Verdana"; font-size: x-small;';
config.debug = 0;// NOTE: You can remove any of these blocks and use the default config!config.toolbar = [
//['fontname'],
//['fontsize'],
//['fontstyle'],
// ['linebreak'],
['bold','italic','underline','separator'],
['strikethrough','subscript','superscript','separator'],
['justifyleft','justifycenter','justifyright','separator'],
['OrderedList','UnOrderedList','Outdent','Indent','separator'],
// ['forecolor','backcolor','separator'],
// ['HorizontalRule','Createlink','InsertImage','htmlmode','separator'],
// ['about','help','popupeditor'],
];
editor_generate('maintext',config);
</script>


 
 
 


Search for (options)