TinyMCE Forum / empty paragraph disappearing

hmillet · 2006-03-22 02:35:10

Hi !

I'm trying to use tinyMCE since today, and i've got my first problem with it :

I open tinyMCE on the following textarea :

<textarea name="content" cols="98" rows="38"><p> </p><p>toto</p><p> </p></textarea>

Then i immediatly look at the HTML source of my text, and i find this :
<p>toto</p>

So my empties paragraphs before and after my toto's paragraph has disappeared ...

Is it possible to disabling this unwanted cleaning ?

Thanks for your answers

spocke · 2006-03-22 08:15:35

Try HTML entity encode the body before. Like
<textarea name="content" cols="98" rows="38"><p>&nbsp;</p&gt<p>toto</p><p> </p></textarea></textarea>

hmillet · 2006-03-22 09:05:54

I remade a test with encoding my html text, and it works fine.

Thanks a lot

Last edited by hmillet (2006-03-22 13:24:40)

spocke · 2006-03-22 13:31:51

This one is resolved in the latest CVS. Will be released under 2.0.5.1 later today or tomorrow.

hmillet · 2006-03-22 14:41:16

this means that with the new future version, no need to encode html entities ?

spocke · 2006-03-22 14:50:56

Yepp, but it's always nice to encode it anyway.

Aymeric · 2006-03-22 18:27:09

Thx for 2.0.5.1.

I installed it but empty paragraphs are still deleted (I use IE7).

Afraithe · 2006-03-22 19:24:41

Clear your browser cache.

Aymeric · 2006-03-22 21:06:33

done! But no difference...

hmillet · 2006-03-22 22:57:35

It's the same for me.

I've had to comment the code in tiny_mce.js to suppress the problem

spocke · 2006-03-23 07:29:34

Could you send in a test case, example, init etc to help us reproduce this one.

Aymeric · 2006-03-23 09:08:50

thx for your help Spocke.

for the time beeing in the tiny.init, entities is set to null so that the content of editor is saved without entities coding. It's simplifying the way I manipulate (search, store, display, etc.) the data from the mysql database in a ISO-8859-1 context.

But I also set entities to the default value for testing and the result is the same: empty paragraphs are washed up.

By the way, there's another point: the content of the editor is triggersaved without entities coding BUT when I call mceCodeEditor, the simple quotes are replaced by the ' entity. Is there any way to avoid this replacement ? (Sorry for this second question, it's a reminder as there's another post of mine related to it

Here's my tiny.init:
--
mode : "textareas",
theme : "advanced",
language : "fr",
content_css : "style.css",
entities : "",
apply_source_formatting : true,
remove_linebreaks : false,
urlconvertor_callback: "myCustomURLConverter",
save_callback : "myCustomSaveContent",
plugins : "paste,table,advhr,advimage,emotions,insertdatetime,flash,searchreplace,contextmenu",
theme_advanced_buttons1_add : "fontselect,fontsizeselect",
theme_advanced_buttons2_add : "separator,insertdate,inserttime,separator,forecolor,backcolor",
theme_advanced_buttons2_add_before: "cut,copy,paste,separator,search,replace,separator",
theme_advanced_buttons3_add_before : "selectall,pastetext,separator,tablecontrols,separator",
theme_advanced_buttons3_add : "emotions,flash,advhr",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_path_location : "bottom",
plugin_insertdate_dateFormat : " %d-%m-%Y ",
plugin_insertdate_timeFormat : " %H:%M:%S ",
extended_valid_elements : "a[name|href|target=_blank|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name|obj|param|embed],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]",
external_link_list_url : "example_data/example_link_list.js",
external_image_list_url : "example_data/example_image_list.js",
flash_external_list_url : "example_data/example_flash_list.js",
flash_wmode : "transparent",
flash_quality : "high",
flash_menu : "false"
--

myCustomSaveContent is:

function myCustomSaveContent(element_id, html, body) {
// Do some custom HTML cleanup
html = html.replace(/'/g,"'");

return html;
}

Last edited by Aymeric (2006-03-23 09:12:51)

spocke · 2006-03-23 09:21:47

Hmm, seems to work for me anyway.

I tried this in MSIE and added numerous "empty" paragraphs.

Try this one in your browser:
http://tinymce.moxiecode.com/tinymce/ex … e_para.htm

Aymeric · 2006-03-23 09:25:18

yes, the immediate display is correct. But when you come back to the editor, the empty paragraphs are gone!

spocke · 2006-03-23 09:50:30

Ahh, now I see it thanks for this vital information. I resolved this in the latest CVS version so you can grab that for now. The fix for this one will be included in 2.0.6.

Aymeric · 2006-03-23 10:58:22

ok thx spocke.

steph_o · 2006-05-09 11:46:39

Hi all,

I made some tries with the 2.0.6.1 version.
I see that the   are still suppress when reloading the page.
Is it due to the "cleanup at startup" procedure ??

Is there a configuration to tell tiny to not kill the nbsp (or actually replace them by space) ?

Thanks

Stephane

spocke · 2006-05-09 14:15:02

It works for me on the test page. http://tinymce.moxiecode.com/tinymce/ex … e_para.htm
Could you setup a test page of you own so that we have something to compare.

steph_o · 2006-05-09 14:53:50

Hi Spocke,

I will prepare you an access to my system. You'll be able to make test on it.
But, before, my problem is coming when I've got the following html code :

Code:

<p>&nbsp;&nbsp;some text here</p>

I am not the writer of the html code (this is my customer way of coding). They just want to indent a little their text.
But anyway, could you try to change the sample code to fit this, then change the text and see if it's ok for you when submit.
If yes, I will give access to my system, if no, this will give you a good test case.

I saw in the source code of the page that you put entities to "". Is there some influence to the nbsp treatment ?

Thanks in advance

Stephane

Last edited by steph_o (2006-05-09 17:20:38)

steph_o · 2006-05-10 14:58:53

Hi,

It appears that with Firefox, nbsp are suppressed at tinymce' startup, but with IE, nbsp are still here.
These tests have been made with the same tiny config.

Can someone confirm this ???

Stephane

steph_o · 2006-06-01 23:41:15

Hi all,

I'm sorry to be back on this topic, but I still have a problem with nbsp.
Here is a html page that you could put in the tinymce/examples/ directory.
This is a copy of the full sample with a line that begins with some &nbsp :
<p>   test</p>

My problem is when I use tiny on FireFox, the nbsp are suppressed, and not with IE.
Could you confirm me that it happened also on your machine.
My config is : win XP home / tiny 2.0.6.1 / Firefox 1.5 / IE 6

The code

Code:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Full featured example by STEPH</title>
<!-- TinyMCE -->
<script language="javascript" type="text/javascript" src="../jscripts/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
    tinyMCE.init({
        mode : "textareas",
        theme : "advanced",
        lang2uage : "fr",
        content_css : "style.css",
        entities : "",
        apply_source_formatting : true,
        remove_linebreaks : false,
        urlconv2ertor_callback: "myCustomURLConverter",
        save_cal2lback : "myCustomSaveContent",
        plugins : "paste,table,advhr,advimage,emotions,insertdatetime,flash,searchreplace,contextmenu,spellchecker",
        theme_advanced_buttons1_add : "fontselect,fontsizeselect,spellchecker",
        theme_advanced_buttons2_add : "separator,insertdate,inserttime,separator,forecolor,backcolor",
        theme_advanced_buttons2_add_before: "cut,copy,paste,separator,search,replace,separator",
        theme_advanced_buttons3_add_before : "selectall,pastetext,separator,tablecontrols,separator",
        theme_advanced_buttons3_add : "emotions,flash,advhr",
        theme_advanced_toolbar_location : "top",
        theme_advanced_toolbar_align : "left",
        theme_advanced_path_location : "bottom",
        plugin_insertdate_dateFormat : " %d-%m-%Y ",
        plugin_insertdate_timeFormat : " %H:%M:%S ",
        extended_valid_elements : "a[name|href|target=_blank|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name|obj|param|embed],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]",
        ex2ternal_link_list_url : "example_data/example_link_list.js",
        ext2ernal_image_list_url : "example_data/example_image_list.js",
        fla2sh_external_list_url : "example_data/example_flash_list.js",
        flash_wmode : "transparent",
        flash_quality : "high",
        flash_menu : "false"
    });

    function fileBrowserCallBack(field_name, url, type, win) {
        // This is where you insert your custom filebrowser logic
        alert("Example of filebrowser callback: field_name: " + field_name + ", url: " + url + ", type: " + type);

        // Insert new URL, this would normaly be done in a popup
        win.document.forms[0].elements[field_name].value = "someurl.htm";
    }
</script>
<!-- /TinyMCE -->
</head>
<body>

<form method="post" action="http://tinymce.moxiecode.com/dump.php?example=true">

    <textarea id="elm1" name="elm1" rows="15" cols="80" style="width: 100%">
    <p></p><p> </p><p>&nbsp;&nbsp;&nbsp;test</p><p><p>&nbsp;&nbsp;some text here</p>
</p>
    &lt;span class=&quot;example1&quot;&gt;Test header 1&lt;/span&gt;&lt;br /&gt;
    &lt;span class=&quot;example2&quot;&gt;Test header 2&lt;/span&gt;&lt;br /&gt;
    &lt;span class=&quot;example3&quot;&gt;Test header 3&lt;/span&gt;&lt;br /&gt;
    Some &lt;b&gt;element&lt;/b&gt;, this is to be editor 1. &lt;br /&gt; This editor instance has a 100% width to it.
    &lt;p&gt;Some paragraph. &lt;a href=&quot;http://www.sourceforge.net&quot;&gt;Some link&lt;/a&gt;&lt;/p&gt;
    &lt;img src=&quot;logo.jpg&quot;&gt;
    </textarea>
    <br />
    <input type="submit" name="save" value="Submit" />

    <input type="reset" name="reset" value="Reset" />
</form>

</body>
</html>

Thanks a lot for your help

Stephane

relax · 2006-06-03 17:27:13

Same problem here.

nsbp not showing right under Mozilla but working fine in IE6.

trying to show a paste from ssh client putty, the output of "df -h"

which is this:

Code:

Filesystem     Size    Used   Avail Capacity  Mounted on
/dev/ad0s1a    8.5G    5.4G    2.4G    69%    /
devfs          1.0K    1.0K      0B   100%    /dev
/dev/ad1s1d    9.0G    512M    7.8G     6%    /d2

when putting it into the tinymce box first it looks ok untill the page is reloaded - when it puls the info from somewhere rather than me inputting it, it format is lost under Mozilla. but the nbsp code stays in the source. if i click the "html" button after i input the text it it also shows up as expected but after page reload ithe nbsp are gone from the html editor also.

html source:

Code:

        <textarea id="df" cols="100%" rows="10">
        Filesystem&nbsp;&nbsp;&nbsp;&nbsp; Size&nbsp;&nbsp;&nbsp; Used&nbsp;&nbsp; Avail Capacity&nbsp; Mounted on<br> /dev/ad0s1a&nbsp;&nbsp;&nbsp; 8.5G&nbsp;&nbsp;&nbsp; 5.4G&nbsp;&nbsp;&nbsp; 2.4G&nbsp;&nbsp;&nbsp; 69%&nbsp;&nbsp;&nbsp; /<br>

devfs&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
1.0K&nbsp;&nbsp;&nbsp; 1.0K&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
0B&nbsp;&nbsp; 100%&nbsp;&nbsp;&nbsp; /dev<br>
/dev/ad1s1d&nbsp;&nbsp;&nbsp; 9.0G&nbsp;&nbsp;&nbsp;
512M&nbsp;&nbsp;&nbsp; 7.8G&nbsp;&nbsp;&nbsp;&nbsp;

6%&nbsp;&nbsp;&nbsp; /d2<br> <br>        </textarea>

tinymce html editor button output: (alot of whitespace seems to be inplace of the nbsp

Code:

Filesystem     Size    Used   Avail Capacity  Mounted on<br />/dev/ad0s1a    8.5G    5.4G    2.4G    69%    /<br />devfs          1.0K    1.0K      0B   100%    /dev<br />/dev/ad1s1d    9.0G    512M    7.8G     6%    /d2<br /><br />

tinymce config settings are:

Code:

tinyMCE.init({
        theme : "advanced",
        mode : "textareas",
        plugins : "save",
        theme_advanced_buttons3_add : "save",
        theme_advanced_toolbar_location : "top",
        save_enablewhendirty : true
});

Hope i have given enough info to be of use

steph_o · 2006-07-04 21:25:20

Hi all,

I'm back with this topic.
But good news, it's ok for me and my FF.
I had 2 problems :

Cache problem : resolve with one spyware and 10 antispywares that purged the cache of FF.
I'm now using the extension web developper tool under FF, and I disable the cache to force reloading all pages (so no surprise now)

PHP problem : I was using a html_entity_decode($_POST['tiny']) in the called script. This was converting a   to a space (on a second turn in tiny, multi spaces were shout out). I should see it before

relax wrote:
Same problem here...

I tried your code and it's working well.

It was just a reply for those who could be concern

Last minute Edition :
it works good if I give to tinyMce the htmlentities($my_html_var, ENT_QUOTES) and not good if I give directly $my_html_var to tiny

Last edited by steph_o (2006-07-04 22:22:30)

kvdnberg · 2007-03-13 14:43:38

Hi,

I had a similar issue with empty <span>'s within paragraps:

Code:

<p><span style=\"\">&nbsp;</span></p>

This was generated by a Word paste (my customer insists on formatted word pastes that look near identical to the word doc)

In Firefox, the   was stripped after save and open, and the whitespace was gone, not in IE.
When I use htmlentities() in PHP to get the text, this issue is solved.

Last edited by kvdnberg (2007-03-13 14:45:03)

ncavig · 2007-04-03 20:43:59

First time I've posted here, but thought I'd document what I've found out. I had the same type of problem with white spaces where it wasn't saving, then went through "preformatted : true" option which tended to use the pre tag way too much for my liking. I spent a few days mixing and matching different options and trying to get saves to work with an AJAX autosave plugin I've written (which when I get some free time might actually code for the general publics use). Here's the sequence of events that I've discovered. (Not tested in IE of any sort)

I use mode: exact, as well as elements : "editor" (which is a textarea NOT div). Also, everything is done via AJAX so page reloads are really just div refreshes or div replacements via javascript.

1. Text is saved from tinyMCE editor using the built in save plugin. The spaces are transfered as   and empty paragraphs are <p> </p> (all is well)

2. I check my database entry to make sure, low and behold, the   code fragments are present exactly where they need to be

3. I close tinyMCE editor, reopen it via an AJAX call, and this is where it gets tricky. I finally realized what was going on here after my autosave was claiming conflicts between my opened document and what was in the editor. ("Your document has changed since your last save. Do you wish to exit without saving?") Here's the process as it was opened
a. Database loaded text goes into the textarea via <textarea name="content" id="content" cols="50" rows="15"><%= @essay.body %></textarea>"
b. When TinyMCE does it's magic and load's from the textarea, the content of the textarea is then moved to the TinyMCE editor.
c. Textarea's take HTML in. The editor takes HTML in. The current flow would mean that if the text I try to put in the textarea is html, it wouldn't be html when going from the textarea to the tinyMCE editor. For example: let's say you wanted to start an essay and tabbed in your paragraph like the good student you are, "      The story starts with a boy and...". In the database if you had "      The story starts with a boy and...", it would show up in your page code as ""      The story starts with a boy and..." but the textarea would change it on load to " The story starts with a boy and..." which then goes to the TinyMCE editor as " The story starts with a boy and..." with no HTML tags.

Basically what I've done is converted all ampersands into & when saved to the database. Then the above would end up printing into the page "&nbsp; &nbsp; &nbsp; The story starts with a boy and..." then to the textarea of "      The story starts with a boy and..." then to tinyMCE editor with the correct spacing and formatting.

Hope this helped, and I apologize if this was located somewhere else in the forum.

Ruby on rails : Use text_variable.gsub(/&/, "&")
Javascript : textVariable.replace(/&/g, "&"); //g makes it a global replace, not just a one time replace

#1 2006-03-22 02:35:10

empty paragraph disappearing

#2 2006-03-22 08:15:35

Re: empty paragraph disappearing

#3 2006-03-22 09:05:54

Re: empty paragraph disappearing

#4 2006-03-22 13:31:51

Re: empty paragraph disappearing

#5 2006-03-22 14:41:16

Re: empty paragraph disappearing

#6 2006-03-22 14:50:56

Re: empty paragraph disappearing

#7 2006-03-22 18:27:09

Re: empty paragraph disappearing

#8 2006-03-22 19:24:41

Re: empty paragraph disappearing

#9 2006-03-22 21:06:33

Re: empty paragraph disappearing

#10 2006-03-22 22:57:35

Re: empty paragraph disappearing

#11 2006-03-23 07:29:34

Re: empty paragraph disappearing

#12 2006-03-23 09:08:50

Re: empty paragraph disappearing

#13 2006-03-23 09:21:47

Re: empty paragraph disappearing

#14 2006-03-23 09:25:18

Re: empty paragraph disappearing

#15 2006-03-23 09:50:30

Re: empty paragraph disappearing

#16 2006-03-23 10:58:22

Re: empty paragraph disappearing

#17 2006-05-09 11:46:39

Re: empty paragraph disappearing

#18 2006-05-09 14:15:02

Re: empty paragraph disappearing

#19 2006-05-09 14:53:50

Re: empty paragraph disappearing

Code:

#20 2006-05-10 14:58:53

Re: empty paragraph disappearing

#21 2006-06-01 23:41:15

Re: empty paragraph disappearing

Code:

#22 2006-06-03 17:27:13

Re: empty paragraph disappearing

Code:

Code:

Code:

Code:

#23 2006-07-04 21:25:20

Re: empty paragraph disappearing

relax wrote:

#24 2007-03-13 14:43:38

Re: empty paragraph disappearing

Code:

#25 2007-04-03 20:43:59

Re: empty paragraph disappearing

Board footer