Problem with createTextNode

[patxiworks]

Can anybody figure out why document.createTextNode returns "undefined" whenever I try to use it with a function as argument? E.g

document.createTextNode(foo("this","that"));

On it's own, foo("this","that") is supposed to format a text (it is a method that does not return anything). So that the document.createTextNode method outputs the formatted text immediately.

Unfortunately, it seems to also output "undefined" along with the formatted text.

I'm wondering why...

[patxiworks]

OK, I was able to get rid of the "undefined" output. But I had to make foo("this","that") return an empty string (return "") so that document.createTextNode(...) outputted nothing.

It "solves" my problem, but it doesn't look like a standard way of doing things.

[visionmonster]

createTextNode is looking for a parameter type "string": [w3.org...]

you would need to have foo return the string that you formatted:

note that html is escaped you would get <b>thisthat</b> rather than thisthat
quick example:

<div id="test"></div>
<script type="text/javascript">
function foo(s_this,s_that){
myFormattedString = "<b>"+s_this+s_that+"</b>";
return myFormattedString;
}
o_test = document.getElementById("test");
o_text = document.createTextNode(foo("this","that"));
o_test.appendChild(o_text);
</script>

if you want to format the text with html elements you would need to create each element separately.

it would probably be just easier to replace:
o_test.appendChild(o_text); with o_test.innerHTML+= foo("this","that");

hth

[patxiworks]

Thanks a lot! It's clear enough, but is returning an empty string OK (return "")? When I return false or null, createTextNode prints out "false" or "null" as the output.

[Fotiman]

Returning and empty string will cause your newly created text node to be an empty string. Is that what you want?

[visionmonster]

you could have it return "";

but then createTextNode isn't really being used for what it was intended. all it would be doing is creating an empty #text node.

if foo("this","that"); is appending the formatted text string to the document then you probably don't even need to use createTextNode and could call foo on it's own. unless you are using appendChild with createTextNode, you probably don't need it.

maybe this example will clear it up a little more:

<span id="test">
<!--this: -->
<b>thisthat</b></span>
<script type="text/javascript">
//is the same as:
function foo(s_this,s_that){
myFormattedString = "<b>"+s_this+s_that+"</b>";
return myFormattedString;
}
o_test = document.getElementById("test");
o_test.innerHTML+= foo("this","that");
//is the same as:
o_b = document.createElement("b");
o_b.appendChild(document.createTextNode("thisthat"));
o_test.appendChild(o_b);
</script>

if you view this in FF select the output then right click and choose "view selected source" you will see:

<b>thisthat</b><b>thisthat</b><b>thisthat</b>

[patxiworks]

Thanks for the replies... was away for a while.

Actually, I'm using a function from one of the adaptations of TiddlyWiki. What it does (from what I've gathered) is to "wikify" a given string that is passed to it so that it becomes a "Tiddler". If you know about TiddlyWiki, you'd probably understand what I mean (http://www.tiddlywiki.com).

So, to extend the application, I decided to fix in a javascript calendar and "wikify" the date entries so that each of the dates came out as a "tiddler". The calendar writes these dates dynamically - using createTextNode as so:

...
td = document.createElement("td");
td.appendChild(document.createTextNode(setDate());
...

contained in a loop that goes through the days of a given month. So to create a tiddler from a given date, I had to alter the code:

...
td = document.createElement("td");
td.appendChild(document.createTextNode(createTiddlerText(setDate(),div));
...

But the function createTiddlerText() does not return anything. It simply does some formatting to the string and the code flow continues. That was when I was receiving the "undefined" in my calendar. So I had to make createTiddlerText return "".

Actually, createTiddlerText converted the dates to "tiddlers" but kept on spitting out "undefined".

Since you say return "" is okay, then fine. I just wanted to explain why I needed to return nothing.