Connecting Tech Pros Worldwide Forums | Help | Site Map

where to find rules about punctuation in JavaScript dynamic table population

murrayatuptowngallery@yahoo.com
Guest
 
Posts: n/a
#1: Sep 27 '05
Hello:

I previously posted a question about how to do populate an html table
dynamically with results from JavaScript Math and basic math. Dr Clue
responded and this started the learning curve. I think the terminology
for what I want to do is pass variables to the <td> 'workspace' (half
this statement might make sense).

The problem I am having is being overwhelmed with understanding the
context of each new statement, syntax etc.

I have had difficulty finding explanations of the use of proper
punctuation. I see for example, code with <td> and <tr> that also have
+ + surrounding what look like the desired variables.

Yet, obviously I am not understanding the proper usage because one of
two things happen; either a cut and pasted example was much more
complex than what I need and I can't get it running at all due to
missing parts, or I am buried with 'errors on page'.

Will html validation explain to me what heinous errors have been
committed?

I've looked at W3 std on the Web and books, and example after example,
but found little if any explanation of what the function is of each
punctuation element in these 'exotic' examples. I call them exotic
because I'm sure not finding them.

If posting a snip of code would be a better way to ask 'what's wrong',
I can do that.

One thing I think would work for me is simply a way to output
(document.write or whatever method) to a <td> "+ varname +" </td> kind
of thing. If I actually wrote something correctly, I didn't do it
consciously.

I've tried searching before posting, but obviously I'm looking for the
wrong thing or progress in my case is exceedingly slow.

Thank you
Murray


Newbie
 
Join Date: Sep 2005
Posts: 2
#2: Sep 27 '05

re: where to find rules about punctuation in JavaScript dynamic table population


Sounds like you may be getting hung up on the proper use of quotes and plus signs. Basically, whatever type of quote you use to delimit a string, must be escaped inside of it and a string segment must be closed using its delimiting quote style before adding (the plus sign) a defined variable. You can use either single (') or double (") quotes to delimit a string. If quotes not used as delimiters are included in the string, it is best to use the type of quotes appearing the least frequently in the string to delimit it. An example:

[PHP]var animal='dog'

document.write("Haven't you got a "+animal+" yet?")[/PHP]I used PHP code tags because they highlight the syntax of the statements well but, this is javascript. It will write this line to the page:

Haven't you got a dog yet?

In the code example the double quotes are the delimiters. If I had used single quotes to delimit the string, then I would had to escape the one used in the contraction:
Expand|Select|Wrap|Line Numbers
  1. document.write('Haven[COLOR=Red]\'[/COLOR]t you got a '+animal+' yet?')
Here, only the escaped single quote is syntax highlighted.
Mick White
Guest
 
Posts: n/a
#3: Sep 27 '05

re: where to find rules about punctuation in JavaScript dynamic table population


murrayatuptowngallery@yahoo.com wrote:[color=blue]
> Hello:
>
> I previously posted a question about how to do populate an html table
> dynamically with results from JavaScript Math and basic math. Dr Clue
> responded and this started the learning curve. I think the terminology
> for what I want to do is pass variables to the <td> 'workspace' (half
> this statement might make sense).
>
> The problem I am having is being overwhelmed with understanding the
> context of each new statement, syntax etc.[/color]
[snip]
Look up "concatenation javascript".

"String surrounded by quotes" + variable +"Another string"

The "+" operator is overloaded in js, thus the context of the statement
dictates its function:

String + Number = String
"2"+2=="22"

Number + Number = Number
2+2==4

For example:
"2"+(2+2)=="24"
Number("2")+(2+2)==6 // convert String to Number
(2+2)+ +("2")==6 // using the "+" for the conversion +("2")

HTH
Mick

murrayatuptowngallery@yahoo.com
Guest
 
Posts: n/a
#4: Oct 14 '05

re: where to find rules about punctuation in JavaScript dynamic table population


I am still having trouble evolving to the next level of enlightenment.

I've resigned myself to doing my calculations by multiplying array
elements and opening a new window and doc.write to the screen for a
printout option separate from the original web page.

With that working pretty well, I tried to pass contents of variables to
a table as <td> </td>content based on example code, but each sample or
advise I've received has 'new' elements or implied function I am not
grasping, and despite me efforts to go read and understand the context
of the other methods, it's just not sinking in.

I thought it might be simpler to post what I am TRYING to do, and then
perhaps what is missing will be obvious.

Below is a simplified example. The actual stuff is messier, and reads
from an input form but this boils down the math & malfunctioning table
parts. I realize I can clean it up by using "with Math..." and maybe
some other simplification.

The problem seems to be that I am not properly "enabling" the variables
for the table data. That's the hard part (for me) of dissecting someone
else's code; if I don't know the rules for each 'functional part',
mimicking something gives unpredictable results.

I think the open-ended flexibility of DOM is where I am lost. I can't
tell what is infinitely possible and what has rigid rules.

Also, can one increment a counting element by 0.5 in a JS 'for'
statement? I tried in VB and it seemed to work there.

Thanks

Murray
---------------------
<html>
<body>

<script type="text/javascript">
var AAA = new Array(4)

AAA[0] = 0.1*Math.round(10*Math.log(32)/Math.log(2))
AAA[1] = 0.1*Math.round(10*Math.log(16)/Math.log(2))
AAA[2] = 0.1*Math.round(10*Math.log(8)/Math.log(2))
AAA[3] = 0.1*Math.round(10*Math.log(5.656)/Math.log(2))

for (i=0;i<AAA.length;i++)
{
document.write(AAA[i] + "<br />")
}
</script>
<hr>
<table border="2">

<tr>
<td>AAA[0]</td>
<td>AAA[1]</td>
</tr>
<tr>
<td>AAA[2</td>
<td>AAA[3]</td>
</tr>
</table>

</body>
</html>

Mick White
Guest
 
Posts: n/a
#5: Oct 14 '05

re: where to find rules about punctuation in JavaScript dynamic table population


murrayatuptowngallery@yahoo.com wrote:
[color=blue]
> I am still having trouble evolving to the next level of enlightenment.
>
> I've resigned myself to doing my calculations by multiplying array
> elements and opening a new window and doc.write to the screen for a
> printout option separate from the original web page.
>
> With that working pretty well, I tried to pass contents of variables to
> a table as <td> </td>content based on example code, but each sample or
> advise I've received has 'new' elements or implied function I am not
> grasping, and despite me efforts to go read and understand the context
> of the other methods, it's just not sinking in.
>
> I thought it might be simpler to post what I am TRYING to do, and then
> perhaps what is missing will be obvious.
>
> Below is a simplified example. The actual stuff is messier, and reads
> from an input form but this boils down the math & malfunctioning table
> parts. I realize I can clean it up by using "with Math..." and maybe
> some other simplification.
>
> The problem seems to be that I am not properly "enabling" the variables
> for the table data. That's the hard part (for me) of dissecting someone
> else's code; if I don't know the rules for each 'functional part',
> mimicking something gives unpredictable results.
>
> I think the open-ended flexibility of DOM is where I am lost. I can't
> tell what is infinitely possible and what has rigid rules.
>
> Also, can one increment a counting element by 0.5 in a JS 'for'
> statement? I tried in VB and it seemed to work there.
>
> Thanks
>
> Murray
> ---------------------
> <html>
> <body>
>[/color]
<script type="text/javascript">
var AAA = new Array(4)

AAA[0] = 0.1*Math.round(10*Math.log(32)/Math.log(2))
AAA[1] = 0.1*Math.round(10*Math.log(16)/Math.log(2))
AAA[2] = 0.1*Math.round(10*Math.log(8)/Math.log(2))
AAA[3] = 0.1*Math.round(10*Math.log(5.656)/Math.log(2))

theTable='<table border="2"><tr><td>';
theTable+=AAA[0];
theTable+='</td><td>';
theTable+=AAA[1];
theTable+='</td></tr><tr><td>';
theTable+=AAA[2];
theTable+='</td><td>';
theTable+=AAA[3];
theTable+=</td></tr></table>;
document.write(theTable);
//or
document.write(AAA.join("<BR>"))

</script>

Mick

murrayatuptowngallery@yahoo.com
Guest
 
Posts: n/a
#6: Oct 15 '05

re: where to find rules about punctuation in JavaScript dynamic table population


Thank you, Mick.

One more question regarding the table format below. It is apparent that
yours has a totally different 'style' with more 'rules' than the most
primitive form I employed.

Is there a description of what structure your code conforms to?
Is it DOM? The ; at end of each line and the variation in = and += are
the kind of subtleties that have to be right and one will never get
right without grasping how it all goes together.

I bounce from one on-line tutorial to another and find that I'm
learning one command at a time but not the BIG picture.

It's analogous to being illiterate and wishing to read Shakespeare.
Figuring out how to build a learning curve is the next challenge.

I suppose if I needed it for work I could take training courses. For a
not-for-profit path, could you recommend any reading? It would be nice
if I could answer more of my own questions, so I would be the only one
hearing them repeated.

Thanks

Murray
[color=blue]
> theTable='<table border="2"><tr><td>';
> theTable+=AAA[0];
> theTable+='</td><td>';
> theTable+=AAA[1];
> theTable+='</td></tr><tr><td>';
> theTable+=AAA[2];
> theTable+='</td><td>';
> theTable+=AAA[3];
> theTable+=</td></tr></table>;
> document.write(theTable);
> //or
> document.write(AAA.join("<BR>"))
>
> </script>
>
> Mick[/color]

Mick White
Guest
 
Posts: n/a
#7: Oct 15 '05

re: where to find rules about punctuation in JavaScript dynamic table population


murrayatuptowngallery@yahoo.com wrote:[color=blue]
> Thank you, Mick.
>
> One more question regarding the table format below. It is apparent that
> yours has a totally different 'style' with more 'rules' than the most
> primitive form I employed.
>
> Is there a description of what structure your code conforms to?
> Is it DOM? The ; at end of each line and the variation in = and += are
> the kind of subtleties that have to be right and one will never get
> right without grasping how it all goes together.[/color]

a+=b
a=a+b
The expressions are equivalent, and are core javascript (part of the
language itself). The DOM is part of the browser, the DOM exposes
objects to javascript. (document, window etc.)


What I offered is a quick (and dirty) way of using js to write HTML. If
you are interested in the BIG picture, you need to familiarise yourself
with programming concepts - functions, parameters, scope, iteration etc.

The case that you present -stuffing array values into table cells- is
trivial, thus I offered a one-off solution.

I would approach the coding quite differently. I would look for a
*generic* way to accomplish the task at hand:

function stuffArrayValuesIntoTable(array,tableID){
//do stuff here
}

I try to avoid "document.write()" if I can, in favour of DOM techniques.

function stuffArrayValuesIntoTable(array,tableID){
if(!tableID){
// create a table
}
else{
var theTable;
if(theTable=document.getElementById(tableID)){//Table exists
if(array.length>0){//"array" looks like an Array
//do stuff with the table and array
}
}
else{//Flaky ID, or non-DOM browser
return;//exit function
}
}

For further reading:
http://www.mozilla.org/docs/dom/refe...avascript.html

Mick
[color=blue]
>
> I bounce from one on-line tutorial to another and find that I'm
> learning one command at a time but not the BIG picture.
>
> It's analogous to being illiterate and wishing to read Shakespeare.
> Figuring out how to build a learning curve is the next challenge.
>
> I suppose if I needed it for work I could take training courses. For a
> not-for-profit path, could you recommend any reading? It would be nice
> if I could answer more of my own questions, so I would be the only one
> hearing them repeated.
>
> Thanks
>
> Murray
>
>[color=green]
>>theTable='<table border="2"><tr><td>';
>>theTable+=AAA[0];
>>theTable+='</td><td>';
>>theTable+=AAA[1];
>>theTable+='</td></tr><tr><td>';
>>theTable+=AAA[2];
>>theTable+='</td><td>';
>>theTable+=AAA[3];
>>theTable+=</td></tr></table>;
>>document.write(theTable);
>>//or
>>document.write(AAA.join("<BR>"))
>>
>></script>
>>
>>Mick[/color]
>
>[/color]
murrayatuptowngallery
Guest
 
Posts: n/a
#8: Oct 16 '05

re: where to find rules about punctuation in JavaScript dynamic table population


Thank you

Closed Thread