a little help with javascript

@vizzleDec 01.2007

i need help creating a table with any number entered
is if the number 5 was entered
a 5 by 5 table will appear
i was able to create the table
but it would show 25 cells in a row apeared
here is the code i have made so far:

~~[QUOTE]~~

<body>
<table border = ‘0’ bgcolor=’#f3f3f3′>
enter a number greater than 1 and a frame will be created.<br><br>
<script language=”JavaScript”>

var framenum = parseInt(prompt(“Enter a number greater than 1″,””)); //takes the users input and stores it in variable framenum

if (isNaN(framenum) || (framenum< 0)){document.write(“<strong>please refresh the page and type in number greater than 1</strong><br>”);} //if number is less than 0 or greater than 100000 tells user the number is not correct

if ((framenum>=1)){window.document.write(“the number you have chosen is ” + framenum+”.<br>”);} //if the number is correct prints the number and the equal sign

var array;

function createarray(n) {

array = new Array(n);

for (i = 0 ; i < n ; i = i + 1) { array[i] = new Array(n) ; }

for (i = 0, k = 1; i < n ; i = i + 1) { for (j = 0; j < n ; j = j + 1, k = k + 1) { array[i][j] = k ; } } } var i, j;

createarray(framenum);

for (i = 0; i < framenum; i = i + 1) {

for (j = 0; j < framenum; j = j + 1) { document.write(“<td>table</td>”);

} }

</script>
</table>

</body>

[/QUOTE]

to post a comment

JavaScript

8 Comments(s) _↴

@ZeroKilledDec 01.2007 — #the problem is that you're not writing row on each iteration. so, each cell is written on a single row. you have to add the opening tag before writing cells and the closing tag after cells are wrote. i had modified the following code a bit for testing purpose:

<i>
 </i>for (i = 0; i &lt; framenum; i++) {
 document.write("&lt;tr&gt;");
 for (j = 0; j &lt; framenum; j++) {
 document.write("&lt;td&gt;" + j + "&lt;/td&gt;");
 }
 document.write("&lt;/tr&gt;");
 }

@vizzleauthorDec 01.2007 — #thank you

i was also having trouble with the color

how to go about creating colored frames with in the array

for exmple if the array was 5 by 5

it would look like this:

R R R R R

R Y Y Y R

R Y B Y R

R Y Y Y R

R R R R R

where R is red

y is yellow

and B is blue

@Ay__351_eDec 01.2007 — #

 <br/>
 &lt;body&gt;
 &lt;table&gt;
 &lt;script type="text/javascript"&gt;
 
 for(var i = 1; i&lt;6; i++) {
 document.write("&lt;tr&gt;");
 for(var j = 1; j&lt;6; j++) {
 var mycolor = (( i * j ) == 9 ) ? "blue" :  (i &gt; 1 &amp;&amp; i &lt; 5 &amp;&amp; j &gt; 1 &amp;&amp; j &lt; 5) ? "yellow" : "red";
 document.write("&lt;td style='background-color:"+mycolor+";'&gt;" + (i * j) + "&lt;/td&gt;");
 }
 document.write("&lt;/tr&gt;");
 }
 &lt;/script&gt;
 &lt;/table&gt;

@vizzleauthorDec 01.2007 — #i was able to add the code and tinker with it

but i wasn't able to manipulate it to any amount of rows and cols

@Ay__351_eDec 02.2007 — #

 <br/>
 &lt;body&gt;enter a number greater than 1 and a frame will be created.&lt;br&gt;&lt;br&gt;
 
 &lt;script type="text/javascript"&gt;
 
 var framenum = parseInt(prompt("Enter a number greater than 1","")); //takes the users input and stores it in variable framenum
 
 if (isNaN(framenum) || (framenum&lt; 0)){
 document.write("&lt;strong&gt;please refresh the page and type in number greater than 1&lt;/strong&gt;&lt;br&gt;");
 } /* if number is less than 0 or greater than 100000 tells user the number is not correct*/
 
 if ((framenum&gt;=1)){
 document.write("the number you have chosen is " + framenum+".&lt;br&gt;");} 
 // if the number is correct prints the number and the equal sign
 
 function myTable(f) {
 var row = f;
 var col = f;
 var tdcolor = new Array("red","yellow","blue","aqua","pink","lime","maroon","turquoise","green","#FF8000","#FF8080","#80FF80","#008080","#000080","#8080FF")
 
 document.write('&lt;table border="0"&gt;')
 for(i=1;i&lt;=row;i++){
 document.write(' &lt;tr&gt;')
 for(m=1;m&lt;=col;m++){
 var mycolor ;
 
 for(z=0;z&lt;=tdcolor.length;z++){
 
 if (i &gt; z &amp;&amp; i &lt; (f+1-z) &amp;&amp; m &gt; z &amp;&amp; m &lt; (f+1-z))  mycolor = tdcolor[z] ;
 }
 document.write('&lt;td style="width:15px;height:15px;background-color:'+mycolor+';"&gt; &lt;/td&gt;')
 }
 document.write(' &lt;/tr&gt;')
 }
 document.write('&lt;/table&gt;')
 }
 myTable(framenum);
 &lt;/script&gt;
 &lt;/table&gt;
 
 
 
 &lt;/body&gt;

@Ay__351_eDec 02.2007 — #You can write

[color=green]for(z=0;z<f+1-z;z++)[/color]

instead of

[color=red]for(z=0;z<=tdcolor.length;z++)[/color]

for short loop

@Ay__351_eDec 02.2007 — #advanced version of previous code. It loops less than the first one.

 <br/>
 &lt;body&gt;enter a number greater than 1 and a frame will be created.&lt;br&gt;&lt;br&gt;
 
 &lt;script type="text/javascript"&gt;
 
 var framenum = parseInt(prompt("Enter a number greater than 1","")); //takes the users input and stores it in variable framenum
 
 if (isNaN(framenum) || (framenum&lt; 0)){
 document.write("&lt;strong&gt;please refresh the page and type in number greater than 1&lt;/strong&gt;&lt;br&gt;");
 } /* if number is less than 0 or greater than 100 tells user the number is not correct*/
 
 if ((framenum&gt;=1)){
 document.write("the number you have chosen is " + framenum+".&lt;br&gt;");} 
 // if the number is correct prints the number and the equal sign
 
 function myTable(f) {
 
 var row = f;
 var col = f;
 var tdcolor = new Array("red","yellow","blue","aqua","pink","lime","maroon","turquoise","green","#FF8000","#FF8080","#80FF80","#008080","#000080","#8080FF")
 
 document.write('&lt;table border="0"&gt;')
 for(i=1;i&lt;=row;i++){
 document.write(' &lt;tr&gt;')
 for(m=1;m&lt;=col;m++){
 var mycolor ;
 var kac = 0;
 var cik = 0;
 for(z=0;z&lt;f-z;z++){
 if (i &gt; z &amp;&amp; i &lt; (f+1-z) &amp;&amp; m &gt; z &amp;&amp; m &lt; (f+1-z)) { mycolor = tdcolor[z]; }
 else { z=f;}
 }
 document.write('&lt;td style="width:15px;height:15px;background-color:'+mycolor+';"&gt; &lt;/td&gt;')
 }
 document.write(' &lt;/tr&gt;')
 }
 document.write('&lt;/table&gt;')
 }
 myTable(framenum);
 &lt;/script&gt;
 &lt;/table&gt;
 &lt;/body&gt;

@Ay__351_eDec 03.2007 — #

 <br/>
 &lt;body&gt;
 &lt;script type="text/javascript"&gt;
 var rownum = parseInt(prompt("Enter a number of row greater than 1",""));
 var colnum = parseInt(prompt("Enter a number of column greater than 1","")); 
 
 function myTable(r,c) {
 var row = r;
 var col = c;
 var tdcolor = new Array("red","yellow","blue","aqua","pink","lime","turquoise")
 
 document.write('&lt;table border="0"&gt;')
 for(i=1;i&lt;=row;i++){  // number of rows
 document.write(' &lt;tr&gt;')
 for(m=1;m&lt;=col;m++){ // number of columns
 var mycolor ; 
 var u = Math.min(i,m,row+1-i,col+1-m); // return to minimum. the heart of the code
 var renk = (u-1)%tdcolor.length; 
 mycolor = tdcolor[renk]; // assigns color of cell 
 
 document.write('&lt;td style="width:15px;height:15px;background-color:'+mycolor+';"&gt;&lt;/td&gt;')
 }
 document.write(' &lt;/tr&gt;')
 }
 document.write('&lt;/table&gt;')
 }
 if(rownum&gt;0&amp;&amp;rownum&lt;100 &amp;&amp; colnum&gt;0&amp;&amp;colnum &lt; 100) myTable(rownum,colnum);
 else alert("row number and colunm number must be smaller than 100");
 &lt;/script&gt;
 &lt;/table&gt;
 &lt;/body&gt;

Also in #JavaScript _↴

changing the bgcolor from a <div>Limiting Number of Characters in Text Field loading a URL radomly from an array

Success!

Help @vizzle spread the word by sharing this article on Twitter...

Tweet This

a little help with javascript

8 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

a little help with javascript

8 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

8 Comments(s) _↴

Also in #JavaScript _↴