htmlArea

A directory of browser-based WYSIWYG editors

  MAIN
INDEX
SEARCH
POSTS
WHO'S
ONLINE
LOG
IN

Home: htmlArea 3 (beta): htmlArea 2 & 3 archive (read only): htmlArea v3.0 - Discussion:
TableOperations dosent work


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.

 


drummer
Novice

Dec 9, 2004, 1:52 AM

Post #1 of 2 (2987 views)
Shortcut
TableOperations dosent work Can't Post

When I customize the toolbar the TableOperations doesn't work (buttonrow disapears). when i use the default it works fine. The code I use is below. Please Help!

<!-- Configure the path to the editor. We make it relative now, so that the
example ZIP file will work anywhere, but please NOTE THAT it's better to
have it an absolute path, such as '/htmlarea/'. -->
<script type="text/javascript">
_editor_url = "htmlarea";
_editor_lang = "no";
</script>
<!--<script type="text/javascript" src="htmlarea/htmlarea_config.js"></script> -->
<script type="text/javascript" src="htmlarea/htmlarea.js"></script>


<script type="text/javascript">
//load the ImageManage + Editor plug-in
// Kod här mellan neråt

HTMLArea.loadPlugin("ImageManager");
HTMLArea.loadPlugin("ContextMenu");
HTMLArea.loadPlugin("TableOperations");

var editor = null;
function initEditor() {

var editor = new HTMLArea("tb2_innehall");


editor.registerPlugin("ImageManager");
editor.registerPlugin("ContextMenu");
editor.registerPlugin("TableOperations");
// infogar egen stylesheet
//editor.config.pageStyle = "@import url(../assets/css/pageglobal_2.css);";

var config = editor.config;

// the following replaces the textarea with the given id with a new
// HTMLArea object having the specified configuration


config.toolbar = [
[ "formatblock", "space",
"bold", "italic", "strikethrough", "separator",
"subscript", "superscript", "separator",
"copy", "cut", "paste", "space", "undo", "redo" ],

[ "justifyleft", "justifycenter", "justifyright", "justifyfull", "separator",
"lefttoright", "righttoleft", "separator",
"orderedlist", "unorderedlist", "outdent", "indent", "separator",
"inserthorizontalrule", "createlink", "insertimage", "inserttable", "htmlmode", "separator" ]
];



config.fontsize = {
"1 (8 px)": "1",
"2 (10 px)": "2",
"3 (12 px)": "3",
"4 (14 px)": "4",
"5 (18 px)": "5",
};

config.formatblock = {
"Rubrik": "h3",
"Normal": "p"
};

config.pageStyle =
'body,table,td,th,p,ul,ol,li,h5,h6,h4,h3,h2, .brodtext2{ font-family: Verdana, Arial, Helvetica, sans-serif; } ' +
'body,table,td,th,ul,ol,li, .brodtext { font-style: normal; font-weight: normal; line-height: 120%; text-decoration: none } ' +
'body.top { width:100%; min-width: 699px; background-image:url(../bg/main_bg.png); background-position: left top; background-repeat:no-repeat; margin: 0; padding: 0; } ' +
'body.bottom { width:100%; min-width: 699px; background-image:url(../shared/footer.png); background-position: left top; background-repeat:no-repeat; } ' +
'body { background: #ffffff; color: #000000; line-height: 120% } ' +
'body,table,td,th,p,ul,ol,li,h5, a:link, a:visited, a:active, a:hover{ font-size: 11px; } ' +
'h3 { font-size:16px; padding: 0px 10px 0px 10px; margin: 0px 0px 0px 0px; font-weight: bold; font-style: normal; vertical-align: middle; } ' +
'p{ padding: 5px 0px 5px 0px; } ' +
'td.p{ padding: 10px 10px 20px 10px; } ' +
'td.h3 { font-size:16px; color: rgb(0,140,200); padding: 0px 10px 0px 10px; margin: 0px 0px 0px 0px; font-weight: bold; font-style: normal; vertical-align: middle; } ' +
'td.h5 { font-size:11px; color: rgb(0,140,200); padding: 0px 0px 5px 0px; margin: 0px 0px 0px 0px; font-weight: bold; font-style: normal; vertical-align: middle; } ';

editor.generate();
return false;
}

// Kod här mellan uppåt

function insertHTML() {
var html = prompt("Enter some HTML code here");
if (html) {
editor.insertHTML(html);
}
}
function highlight() {
editor.surroundHTML('<span style="background-color: yellow">', '</span>');
}

</script>


tgoyer
New User

Jan 31, 2005, 11:32 AM

Post #2 of 2 (2632 views)
Shortcut
Re: [drummer] TableOperations dosent work [In reply to] Can't Post

I actually had to add the buttons manually. The magic is in the third row button array. Use something like the following:


Code
  

function initEditor() {
editor = new HTMLArea("ta");

editor.registerPlugin(TableOperations);

var cfg = editor.config;
cfg.width = "600px";
cfg.toolbar = [
[
"bold", "italic", "underline", "strikethrough", "separator",
"subscript", "superscript", "separator",
"copy", "cut", "paste", "space", "undo", "redo", "space", "removeformat", "killword"
],
[
"justifyleft", "justifycenter", "justifyright", "separator",
"orderedlist", "unorderedlist", "outdent", "indent", "separator",
"forecolor", "hilitecolor", "separator",
"inserthorizontalrule", "createlink", "insertimage", "separator",
"popupeditor"
],
[
"inserttable", "separator",
"TO-row-prop", "TO-row-insert-above", "TO-row-insert-under", "TO-row-delete", "TO-row-split", "separator",
"TO-col-insert-before", "TO-col-insert-after", "TO-col-delete", "TO-col-split", "separator",
"TO-cell-prop","TO-cell-insert-before","TO-cell-insert-after","TO-cell-delete","TO-cell-merge","TO-cell-split"
]
]
HTMLArea.replace("ta", cfg);
}


 
 
 


Search for (options)