Problem passing string to function

[M.L.]

Basically I'm trying to convert a paragraph within a table cell into a
textarea within that same cell, keeping the paragraph text intact.

However, when I pass the text string to a function called
makeTextarea, both Firefox and IE8 give me the error: 'test_text' is
undefined. I need help determining what I'm doing wrong. Thanks.

function calcRows()
{
var tbody =
document.getElementById("myTable").getElementsByTagName("tbody")[0];
var numRows = tbody.rows.length;
for (var counter = 0; counter < numRows; counter++)
{
if
(tbody.rows[counter].cells[1].getElementsByTagName("textarea")[0])
{
var ptext = "test_text";
tbody.rows[counter].cells[1].innerHTML = '<p
onClick="makeTextarea('+counter+','+ptext+')">'+ptext+'</p>';
}
}
}

function makeTextarea(rownum,mytext)
{
var tbody =
document.getElementById("myTable").getElementsByTagName("tbody")[0];
tbody.rows[rownum].cells[1].innerHTML = '<textarea
name="item_name_"'+rownum+'" class="border3b" rows="5"
maxlength="500">'+mytext+'</textarea>';
}

 

[David Mark]

Basically I'm trying to convert a paragraph within a table cell into a
textarea within that same cell, keeping the paragraph text intact.

However, when I pass the text string to a function called
makeTextarea, both Firefox and IE8 give me the error: 'test_text' is
undefined. I need help determining what I'm doing wrong. Thanks.

function calcRows()
{
var tbody =
document.getElementById("myTable").getElementsByTagName("tbody")[0];
var numRows = tbody.rows.length;
for (var counter = 0; counter < numRows; counter++)
{
if
(tbody.rows[counter].cells[1].getElementsByTagName("textarea")[0])
{
var ptext = "test_text";
tbody.rows[counter].cells[1].innerHTML = '<p
onClick="makeTextarea('+counter+','+ptext+')">'+ptext+'</p>';

^

Right there. What did you forget? You could have saved some time by
logging the string.

 

[M.L.]

Basically I'm trying to convert a paragraph within a table cell into a
textarea within that same cell, keeping the paragraph text intact.

However, when I pass the text string to a function called
makeTextarea, both Firefox and IE8 give me the error: 'test_text' is
undefined. I need help determining what I'm doing wrong. Thanks.

function calcRows()
{
var tbody =
document.getElementById("myTable").getElementsByTagName("tbody")[0];
var numRows = tbody.rows.length;
for (var counter = 0; counter < numRows; counter++)
{
if
(tbody.rows[counter].cells[1].getElementsByTagName("textarea")[0])
{
var ptext = "test_text";
tbody.rows[counter].cells[1].innerHTML = '<p
onClick="makeTextarea('+counter+','+ptext+')">'+ptext+'</p>';

^

Right there. What did you forget? You could have saved some time by
logging the string.

Forget what? Sorry but my JS is rusty. And what does "logging the
string" mean?

 

[M.L.]

However, when I pass the text string to a function called
makeTextarea, both Firefox and IE8 give me the error: 'test_text' is
undefined. I need help determining what I'm doing wrong. Thanks.

function calcRows()
{
var tbody =
document.getElementById("myTable").getElementsByTagName("tbody")[0];
var numRows = tbody.rows.length;
for (var counter = 0; counter < numRows; counter++)
{
if
(tbody.rows[counter].cells[1].getElementsByTagName("textarea")[0])
{
var ptext = "test_text";
tbody.rows[counter].cells[1].innerHTML = '<p
onClick="makeTextarea('+counter+','+ptext+')">'+ptext+'</p>';
^

Right there. What did you forget? You could have saved some time by
logging the string.

Forget what? Sorry but my JS is rusty. And what does "logging the
string" mean?

Term: logging
Interpretation: saving it in a place where you can analyze it when
things go wrong. For example, in Firefox+Firebug you could use
console.log(). In many other cases, a simple alert() will do.

I was already using the Firefox Error Console, which showed me that
the input string was undefined, so I thought "logging the string"
referred to something different.

Term: the string
Interpretation: the value you assign to the cell's innerHTML property.

Term: forgetting
Interpretation: there's something missing in the string; more
specifically, in the value of the onclick attribute. Look at this:
'onClick="makeTextarea('+counter+','+ptext+')"'
After the concatenation, this could look like:
onClick="makeTextarea(0,test_text)"
Now when you click the paragraph, makeTextarea will _not_ be called,
because test_text does not exist.

Recommendation: quote the ptext argument.


</exegesis>

Thanks for the additional clues, but I'm just not getting something
right, even after quoting the argument.

'<p onClick="makeTextarea('+counter+',\"'+ptext2+'\")">'

Firefox Error Console: syntax error
makeTextarea(0,

 

[M.L.]

The onclick attribute is delimited by double quotes, so you can't use
those inside the attribute value. It will come out as

onClick="makeTextarea(0, "test_text")"

The second " ends the attribute value. Try this:

'<p onClick="makeTextarea(' + counter + ",'" + ptext2 + '\')">'

Thanks for your patience Stefan. To help me better understand the
quoting mix I replaced each escaped quote with its HTML entity
character &quot;. It worked!

'<p onClick="makeTextarea('+counter+',&quot;'+ptext+'&quot">'