Table creates borders that won't go away

I confirm this is a bug and I will try to fix this in next release.

The workaround right now is:
- avoid to use Full HTML, mean you can select "Filtered HTML" then add these tags:
<table> <th> <tr> <td>

I'd like to say that I've patched this issue in my version of OpenWYSIWYG. This too annoyed the crap out of me because the system is great and I'm made tons of mods and made my own add-ons to make my CMS the best out there. I have just always had this issue. To resolve this problem, open wysiwyg.js, scroll to about line 1650. You should see the function updateTextArea: function(n){. Look through the commands inside that function and add this before and after the line that reads var content = this.getEditorWindow(n).document.body.innerHTML;
WYSIWYG_Table.disableHighlighting(n); <- This goes before
WYSIWYG_Table.refreshHighlighting(n); <- This goes after

When done, the section should look like it does below.

updateTextArea: function(n) {	
		// on update switch editor back to html mode
		if(this.viewTextMode[n]) { this.viewText(n); }
		// Disable WYSIWYG table styles
		WYSIWYG_Table.disableHighlighting(n);
		// get inner HTML
		var content = this.getEditorWindow(n).document.body.innerHTML;
		// Renenable WYSIWYG table styles
		WYSIWYG_Table.refreshHighlighting(n);
		// strip off defined URLs on IE
		content = this.stripURLPath(n, content);
		// replace all decimal color strings with hex color strings
		content = WYSIWYG_Core.replaceRGBWithHexColor(content);
		// remove line breaks before content will be updated
		//if(this.config[n].ReplaceLineBreaks) { content = content.replace(/(\r\n)|(\n)/ig, ""); }
		// set content back in textarea
		$(n).value = content;
	},

Any other questions or comments, E-Mail me back at dmoree[AT]shadowbranch(DOT)com

I think I found the script you are referring to in modules/openwysiwyg/library/scripts/openwysiwyg.modified.js

Here is my cut/paste after editing (in case I did a typo), but it didn't work.

updateTextArea: function(n) {
// on update switch editor back to html mode
if(this.viewTextMode[n]) { this.viewText(n); }
// Disable WYSIWYG table styles
WYSIWYG_Table.disableHighlighting(n);
// get inner HTML
var content = this.getEditorWindow(n).document.body.innerHTML;
// Renenable WYSIWYG table styles
WYSIWYG_Table.refreshHighlighting(n);
// strip off defined URLs on IE
content = this.stripURLPath(n, content);
// replace all decimal color strings with hex color strings
content = WYSIWYG_Core.replaceRGBWithHexColor(content);
// remove line breaks before content will be updated
if(this.config[n].ReplaceLineBreaks) { content = content.replace(/(\r\n)|(\n)/ig, ""); }
// set content back in textarea
$_openwysiwyg(n).value = content;
},

I tried using filtered HTML with the table tags included, but the bug seems to persist :(

@#4 are you talking about OpenWYSIWYG Editor or Wysiwyg?

@#5 I did the same and also did NOT work
BUT we are modifying openwysiwyg.modified.js while #4 says

open wysiwyg.js, scroll to about line 1650

(which I didn't find)

in file wysuwyg.js

Line : 2688 - 2695

_enableHighlighting: function(node) {
        var style = WYSIWYG_Core.getAttribute(node, "style");	
        if(style == null) style = " ";
        //alert("ENABLE: ELM = " + node.tagName + "; STYLE = " + style);
        WYSIWYG_Core.removeAttribute(node, "prevstyle");
        WYSIWYG_Core.setAttribute(node, "prevstyle", style);
        //WYSIWYG_Core.setAttribute(node, "style", "border:1px dashed #AAAAAA;"); <------- Add Comment to disable table border
},

Is this still an ongoing problem? I have managed to fix part of this problem but are having troubles when saving to the database.
When in design HTML mode you can see the table borders as expected, In TEXT mode the style tags that shows the dashed #aaa border no longer appears. Took me ages to track that down.

My problem is that when i save its saving the code from the HTML view and not the TEXT view which which contains the correct html code. Can anyone help.

Sorry if that sounds jibberish.

Im integrating this with .net by the way but hoping that someone with better javascript skills can help me here.

As most of these posts on here seem dated i havent posted the code i used to remove the table borders but am happy to share with anyone interested.

the_git_2000AThotmail.com

Got the same problem, tried the solutions above without any luck. I still want to see the table in the editor so "thebusted" solution isn't really a option.
It feels like I will have to make an ugly workaround... When getting the text from the database I will try replacing the style code before displaying it it the browser.

I solved it!

On line 2694 there is the following code (if its not this line do a search for "dashed"):
    WYSIWYG_Core.setAttribute(node, "style", "border:1px dashed #AAAAAA;");

Comment it out (put // before it) and oila!

@#11 was your solution committed?

To retain the ability to "see" the table borders in the editor, while allowing for 0px borders in the output, what I did was do a search and replace of the output HTML on the server side, before saving to the database. Kind of a hack, but it works!!!

More specifically, I did a search for:

#aaaaaa 1px dashed

and replaced all instances with:

0px

So, what is saved into the database has 0px borders. The editor, however, always shows the "#aaaaaa 1px dashed" borders for you, even when it reloads the HTML from your database! It's then stripped out again by the search/replace function when you re-save the HTML into your database.

The only caveat to this workaround is if you really DID want borders with #aaaaaa 1px dashed attributes :) I suppose you could put a checkbox elsewhere on the page, to indicate whether or not your server-side code should strip out the "#aaaaaa 1px dashed" style attributes...

Enjoy!

I was unable to find the wysuwyg.js script mentioned above, (I have the most recent build, 6.x-1.0-rc1 2009-Jun-25), but I did locate the same code mentioned above by posters #8 and #11 in this js: openwysiwyg.modified.js, (located here: openwysiwyg/library/scripts). I commented out the appropriate bit, but the annoying #%^#@! border just kept returning; I even deleted the line from the code, but the borders STILL kept coming back.

As a last-ditch effort to maintain a grasp on being easygoing, I performed a search for the word "table" on the entire js document, and on lines 1338-1339 found the following:

// Enable table highlighting
WYSIWYG_Table.refreshHighlighting(n);

I commented out the 2nd line:

 // Enable table highlighting
 // WYSIWYG_Table.refreshHighlighting(n);

And much to my surprise, I don't have borders around my tables any longer. Of course now I can't put a border around a table if I want to...but for the most part, I'm back to being easygoing anyway.

He,

With this methode, when you edit content, you can't see the border off array.

You can modify by adding in the updateTextArea function in the var WYSIWYG :
WYSIWYG_Table.disableHighlighting(n);

By
Thomas
PS : Sorry for my english but I am french.

table border problem

This is a serious problem, I lost 2 hours. The html on every save was changing the table.
I tried changing default style.css, theme, and then totally disabled it, and it again do the same.

At the and I change OpenWYSIWYG Editor and everything was fine.

Hope helped someone.