arcane quotes problem again

DL · May 26, 2008

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.display=''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.

slebetman · May 26, 2008

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.display=''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.

DL · May 26, 2008

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+ \': \<input type="text" name=qCK
\'+i+\' size="60"\> \<br\>   <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>';

Tom de Neef · May 26, 2008

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

\'+i+\' size="60"\> \<br\>   <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+ ':
 <input type="text" name=qCK'+i+' size="60">
 <br>
 
<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>

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:
 <input type="text" name=qCK1 size="60">
 <br>
 
<div id=1>
<button id="chk"+i name="chk"+i
onclick="document.getElementById('chk'+i).style.display='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+' \<input type="text" name='+inputName+'
size="60"> ... etc.

Tom

DL · May 27, 2008

\'+i+\' size="60"\> \<br\>   <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+ ':
 <input type="text" name=qCK'+i+' size="60">
 <br>
 
<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>

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:
 <input type="text" name=qCK1 size="60">
 <br>
 
<div id=1>
<button id="chk"+i name="chk"+i
onclick="document.getElementById('chk'+i).style.display='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+' \<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+' \<input type="text" name='+inputName+'
size="60"\> \<br/> ');
// 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+' \<input type="text" name='+inputName+'
size="60"\> \<br/> <div id='+divID+'><button id='+buttonID+'
name='+buttonID+' onclick="doCheckbox(1,'+i2+','+nr2+');">Add another
checkbox</button></div>');
// ok

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

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

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

Tom de Neef · May 27, 2008

/* but the result of

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

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

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

Tom

DL · May 27, 2008

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

Tom

Thank you so much, it looks like javascripting does not like me

I tried both using
document.getElementById("'+buttonID+'").style.display=\'none\';
inline as well as setting it to a var to no avail.

How come?

slebetman · May 28, 2008

Thank you so much, it looks like javascripting does not like me
I tried both using
document.getElementById("'+buttonID+'").style.display=\'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 + ': ';
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...9007c8e0?lnk=gst&q=html+json#e146b8fe9007c8e0

DL · May 28, 2008

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 + ': ';
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.lang.javascript/browse_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...

An unknown bug doesn't allow the quotes app to work. What's the issue?	3	Apr 23, 2023
I am trying to make an audio player, how do I get the selected file to be playable?	5	Mar 29, 2022
How can I hide a div using an event listener on multiple checkboxes?	6	Dec 23, 2022
Show text on-click with transition	2	Feb 14, 2022
Survey details won't go through using php, ajax, Mysql	0	Oct 26, 2023
Filename undefined for Blob ?	1	Oct 28, 2023
Only one table shows up with the information	2	Mar 29, 2023
Help with code	0	Jun 12, 2022

arcane quotes problem again

DL

slebetman

DL

Tom de Neef

DL

Tom de Neef

DL

slebetman

DL

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads