arcane quotes problem again

DL

The following line is dynamically generated, which works fine at least
with IE7 but what I want more out of it is to disable this button upon
click, so, pls see next line of my attempt to use CSS to disable its
display, however, nasty quote stumbled me.

var newStr = '... <div id='+i+'><button id="chk"+i name="chk"+i
onclick="doCheckbox(1,'+i2+','+nr2+');">Add another checkbox</button></
div>';
// as said, the above code works

var newStr ='... <div id='+i+'><button id="chk"+i name="chk"+i
onclick="document.getElementById('chk'+i).style.di splay=''none'';doCheckbox(1,'+i2+','+nr2+');">Add
another checkbox</button></div>';
// failed
// pls note, the quotes surrounding the word, none, are two single
quotes respectively, the idea is to escape single quote.

Do you have a solution?

Thanks.

Jun 27 '08 #1

slebetman

On May 26, 8:57 am, DL <tatata9...@gmail.comwrote:

The following line is dynamically generated, which works fine at least
with IE7 but what I want more out of it is to disable this button upon
click, so, pls see next line of my attempt to use CSS to disable its
display, however, nasty quote stumbled me.

var newStr = '... <div id='+i+'><button id="chk"+i name="chk"+i
onclick="doCheckbox(1,'+i2+','+nr2+');">Add another checkbox</button></
div>';
// as said, the above code works

var newStr ='... <div id='+i+'><button id="chk"+i name="chk"+i
onclick="document.getElementById('chk'+i).style.di splay=''none'';doCheckbox(1,'+i2+','+nr2+');">Add
another checkbox</button></div>';
// failed
// pls note, the quotes surrounding the word, none, are two single
quotes respectively, the idea is to escape single quote.

Do you have a solution?

You escape by backslash, just like in most other languages: \'

BTW, the string already breaks at: getElementById('chk <---- unescaped
single quote.

Jun 27 '08 #2

DL

On May 25, 9:23*pm, slebetman <slebet...@gmail.comwrote:

On May 26, 8:57 am, DL <tatata9...@gmail.comwrote:

The following line is dynamically generated, which works fine at least
with IE7 but what I want more out of it is to disable this button upon
click, so, pls see next line of my attempt to use CSS to disable its
display, however, nasty quote stumbled me.

var newStr = '... <div id='+i+'><button id="chk"+i name="chk"+i
onclick="doCheckbox(1,'+i2+','+nr2+');">Add another checkbox</button></
div>';
// as said, the above code works

var newStr ='... <div id='+i+'><button id="chk"+i name="chk"+i
onclick="document.getElementById('chk'+i).style.di splay=''none'';doCheckbox*(1,'+i2+','+nr2+');">Add
another checkbox</button></div>';
// failed
// pls note, the quotes surrounding the word, none, are two single
quotes respectively, the idea is to escape single quote.

Do you have a solution?

You escape by backslash, just like in most other languages: \'

BTW, the string already breaks at: getElementById('chk <---- unescaped
single quote.- Hide quoted text -

- Show quoted text -

Thanks and shame on me. Now I need a bit more help with quotes. The
following code use backslash to escape single quote within a singel
quoted long string, it generated an error, what's wrong?

var i = 1;
var newElement = document.createElement();
newElement.innerHTML ='Item\' +i+ \':&nbsp;\<input type="text" name=qCK
\'+i+\' size="60"\>&nbsp;\<br\&nbsp; <div id=\'+i+\'><button
id="chk"+i name="chk"+i onclick="document.getElementById(\'chk
\'+i).style.display=\'none\';doCheckbox(1,\'+i2+\' ,\'+nr2+\');">Add
another checkbox</button></div>';

Jun 27 '08 #3

Tom de Neef

"DL" <ta********@gmail.com wrote:

>

var i = 1;
var newElement = document.createElement();
newElement.innerHTML ='Item\' +i+ \':&nbsp;\<input type="text" name=qCK

\'+i+\' size="60"\>&nbsp;\<br\&nbsp; <div id=\'+i+\'><button
id="chk"+i name="chk"+i onclick="document.getElementById(\'chk
\'+i).style.display=\'none\';doCheckbox(1,\'+i2+\' ,\'+nr2+\');">Add
another checkbox</button></div>';

Yoa assign a string litteral to innerHTML. Taking away the enclosing quotes
and the escape characters, the contents of that string are (I insert
linebreaks and blanks for clarity - they are not part of the string value):
Item' +i+ ':
&nbsp;<input type="text" name=qCK'+i+' size="60">
&nbsp;<br>
&nbsp;
<div id='+i+'>
<button id="chk"+i name="chk"+i
onclick="document.getElementById('chk'+i).style.di splay='none';
doCheckbox(1,'+i2+','+nr2+');">
Add another checkbox
</button>
</div>

The problem is in the very first line: what is "Item'+i+':..." supposed to
mean?
Shouldn't that be "Item+i+':..." ?
Take away the escape \ in front of all quotes that should not appear in the
innerHTML (i.e. leave them only araound chk and none.)
I think it will then get the value
Item1:
&nbsp;<input type="text" name=qCK1 size="60">
&nbsp;<br>
&nbsp;
<div id=1>
<button id="chk"+i name="chk"+i
onclick="document.getElementById('chk'+i).style.di splay='none';
doCheckbox(1,value(i2),value(nr2));">
Add another checkbox
</button>
</div>

Which is still not what you want (it is not valid HTML).
I think it would be wiser to split things up:
var labeli = Item+i;
var inputName = 'qCK'+i;
var divID = i.toString();
var buttonID = 'chk'+i
.... innerHTML = labeli+'&nbsp;\<input type="text" name='+inputName+'
size="60"... etc.

Tom

Jun 27 '08 #4

DL

On May 26, 5:42*am, "Tom de Neef" <tden...@qolor.nlwrote:

"DL" <tatata9...@gmail.com*wrote:

var i = 1;
var newElement = document.createElement();
newElement.innerHTML ='Item\' +i+ \':&nbsp;\<input type="text" name=qCK

\'+i+\' size="60"\>&nbsp;\<br\&nbsp; <div id=\'+i+\'><button
id="chk"+i name="chk"+i *onclick="document.getElementById(\'chk
\'+i).style.display=\'none\';doCheckbox(1,\'+i2+\' ,\'+nr2+\');">Add
another checkbox</button></div>';

Yoa assign a string litteral to innerHTML. Taking away the enclosing quotes
and the escape characters, the contents of that string are (I insert
linebreaks and blanks for clarity - they are not part of the string value):
Item' +i+ ':
&nbsp;<input type="text" name=qCK'+i+' size="60">
&nbsp;<br>
&nbsp;
<div id='+i+'>
* <button id="chk"+i name="chk"+i
* * * *onclick="document.getElementById('chk'+i).style.d isplay='none';
doCheckbox(1,'+i2+','+nr2+');">
* * *Add another checkbox
* </button>
</div>

The problem is in the very first line: what is "Item'+i+':..." supposed to
mean?
Shouldn't that be "Item+i+':..." ?
Take away the escape \ in front of all quotes that should not appear in the
innerHTML (i.e. leave them only araound chk and none.)
I think it will then get the value
Item1:
&nbsp;<input type="text" name=qCK1 size="60">
&nbsp;<br>
&nbsp;
<div id=1>
* <button id="chk"+i name="chk"+i
* * * *onclick="document.getElementById('chk'+i).style.d isplay='none';
doCheckbox(1,value(i2),value(nr2));">
* * *Add another checkbox
* </button>
</div>

Which is still not what you want (it is not valid HTML).
I think it would be wiser to split things up:
var labeli = Item+i;
var inputName = 'qCK'+i;
var divID = i.toString();
var buttonID = 'chk'+i
... innerHTML = labeli+'&nbsp;\<input type="text" name='+inputName+'
size="60"... etc.

Tom

Thank you very much, Tom. I like your solution and approach, getting
very close...

var labeli = 'Checkbox item'+i;
var inputName = 'qCK'+i;
var divID = i.toString();
var buttonID = 'chk'+i

// alert(labeli+'&nbsp;\<input type="text" name='+inputName+'
size="60"\>&nbsp;\<br/>&nbsp;');
// ok

//alert('<div id='+divID+'><button id='+buttonID+' name='+buttonID+'
onclick="doCheckbox(1,'+i2+','+nr2+');">Add another checkbox</button></
div>');
// ok

// now put them together
// alert(labeli+'&nbsp;\<input type="text" name='+inputName+'
size="60"\>&nbsp;\<br/>&nbsp;<div id='+divID+'><button id='+buttonID+'
name='+buttonID+' onclick="doCheckbox(1,'+i2+','+nr2+');">Add another
checkbox</button></div>');
// ok

// final test
// alert(labeli+'&nbsp;\<input type="text" name='+inputName+'
size="60"\>&nbsp;\<br/>&nbsp;<div id='+divID+'><button id='+buttonID+'
name='+buttonID+' onclick="document.getElementById('+buttonID
+').style.display=\'none\';doCheckbox(1,'+i2+','+n r2+');">Add another
checkbox</button></div>');
// looks good
/* but the result of
document.getElementById('+buttonID+').style.displa y=\'none\';
is
document.getElementById(chk1).style.display='none' ;

Shouldn't it be
document.getElementById('chk1').style.display='non e';
I fumbled around a bit, couldn't get that output.
*/

newElement.innerHTML = labeli+'&nbsp;\<input type="text"
name='+inputName+' size="60"\>&nbsp;\<br/>&nbsp;<div id='+divID
+'><button id='+buttonID+' name='+buttonID+'
onclick="document.getElementById('+buttonID+').sty le.display=\'none
\';doCheckbox(1,'+i2+','+nr2+');">Add another checkbox</button></
div>';

Jun 27 '08 #5

Tom de Neef

/* but the result of

document.getElementById('+buttonID+').style.displa y=\'none\';
is
document.getElementById(chk1).style.display='none' ;

Shouldn't it be
document.getElementById('chk1').style.display='non e';

You're right.
You still have the double quotation marks to play with:
.... document.getElementById("'+buttonID+'").style.disp lay=\'none\';

Tom

Jun 27 '08 #6

DL

On May 27, 5:35*am, "Tom de Neef" <tden...@qolor.nlwrote:

/* but the result of
document.getElementById('+buttonID+').style.displa y=\'none\';
is
document.getElementById(chk1).style.display='none' ;
Shouldn't it be
document.getElementById('chk1').style.display='non e';

You're right.
You still have the double quotation marks to play with:
... *document.getElementById("'+buttonID+'").style.dis play=\'none\';

Tom

Thank you so much, it looks like javascripting does not like me :(
I tried both using
document.getElementById("'+buttonID+'").style.disp lay=\'none\';
inline as well as setting it to a var to no avail.

How come?

Jun 27 '08 #7

slebetman

On May 27, 8:09 pm, DL <tatata9...@gmail.comwrote:

On May 27, 5:35 am, "Tom de Neef" <tden...@qolor.nlwrote:

/* but the result of
document.getElementById('+buttonID+').style.displa y=\'none\';
is
document.getElementById(chk1).style.display='none' ;
Shouldn't it be
document.getElementById('chk1').style.display='non e';

You're right.
You still have the double quotation marks to play with:
... document.getElementById("'+buttonID+'").style.disp lay=\'none\';

Tom

Thank you so much, it looks like javascripting does not like me :(
I tried both using
document.getElementById("'+buttonID+'").style.disp lay=\'none\';
inline as well as setting it to a var to no avail.

How come?

Ahh.. we're well into quoting hell here and you'll have the same
problem regardless what language you choose. This is one of the
reasons why inline HTML is often discouraged - quoting can get very
confusing very quickly. Instead do something like:

var i = 1;
var newElement = document.createElement();
newElement.innerHTML ='Item' + i + ':&nbsp;';
var newInput = document.createElement('input');
newInput.type = 'text';
newInput.name = 'qOK' + i;
newInput.size = 60;
newElement.appendChild(newInput);
newElement.appendChild(document.createElement('br' ));
var newDiv = document.createElement('div');
newDiv.id = i;
newElement.appendChild(newDiv);
var newButton = document.createElement('button');
newButton.id = 'chk' + i;
newButton.name = 'chk' + i;
newButton.onclick = function () {
document.getElementById('chk' + i).style.display = 'none';
doCheckbox(1,'i2', 'nr2');
}
newButton.innerHTML = 'Add another checkbox';
newDiv.appendChild(newButton);

of course you can use Thomas's appendFromJSON function to make this
much easier to type. See:
http://groups.google.com/group/comp....46b8fe9007c8e0

Jun 27 '08 #8

DL

>

Thank you so much, it looks like javascripting does not like me :(
I tried both using
document.getElementById("'+buttonID+'").style.disp lay=\'none\';
inline as well as setting it to a var to no avail.

How come?

Ahh.. we're well into quoting hell here and you'll have the same
problem regardless what language you choose. This is one of the
reasons why inline HTML is often discouraged - quoting can get very
confusing very quickly. Instead do something like:

var i = 1;
var newElement = document.createElement();
newElement.innerHTML ='Item' + i + ':&nbsp;';
var newInput = document.createElement('input');
newInput.type = 'text';
newInput.name = 'qOK' + i;
newInput.size = 60;
newElement.appendChild(newInput);
newElement.appendChild(document.createElement('br' ));
var newDiv = document.createElement('div');
newDiv.id = i;
newElement.appendChild(newDiv);
var newButton = document.createElement('button');
newButton.id = 'chk' + i;
newButton.name = 'chk' + i;
newButton.onclick = function () {
* document.getElementById('chk' + i).style.display = 'none';
* doCheckbox(1,'i2', 'nr2');}

newButton.innerHTML = 'Add another checkbox';
newDiv.appendChild(newButton);

of course you can use Thomas's appendFromJSON function to make this
much easier to type. See:http://groups.google.com/group/comp....frm/thread...- Hide quoted text -

- Show quoted text -

Tom, I'm out of the hell now, at least for now :) you taught me how
to escape the single quote, however, I did not fully utilize it in
this situation and when I revisited it again just now I resolved it
(man, I hate javascripting, so messay. But I expect there would be
more advanced javascript headaches ahead...

Jun 27 '08 #9