Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #23489 > unrolled thread

onLoad () and onChange()

Back to article view | Back to comp.lang.javascript

Contents

  onLoad () and onChange() jonas.thornvall@gmail.com - 2014-03-09 17:06 -0700
    Re: onLoad () and onChange() "Jukka K. Korpela" <jkorpela@cs.tut.fi> - 2014-03-10 07:22 +0200
      Re: onLoad () and onChange() "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-03-10 09:49 +0100
        Re: onLoad () and onChange() jonas.thornvall@gmail.com - 2014-03-10 06:56 -0700
          Re: onLoad () and onChange() "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-03-10 15:28 +0100
      Re: onLoad () and onChange() jonas.thornvall@gmail.com - 2014-03-10 05:17 -0700
        Re: onLoad () and onChange() jonas.thornvall@gmail.com - 2014-03-10 05:55 -0700
        Re: onLoad () and onChange() "Jukka K. Korpela" <jkorpela@cs.tut.fi> - 2014-03-10 16:00 +0200
          Re: onLoad () and onChange() jonas.thornvall@gmail.com - 2014-03-10 07:32 -0700
            Re: onLoad () and onChange() "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-03-10 15:46 +0100
              Re: onLoad () and onChange() jonas.thornvall@gmail.com - 2014-03-10 09:58 -0700
                Re: onLoad () and onChange() "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-03-10 23:15 +0100
            Re: onLoad () and onChange() Ben Bacarisse <ben.usenet@bsb.me.uk> - 2014-03-10 17:03 +0000
              Re: onLoad () and onChange() jonas.thornvall@gmail.com - 2014-03-10 10:29 -0700

#23489 — onLoad () and onChange()

I use body onLoad and checkbox onChange "outside form". While sorting out initiation bugs of values in script it seems like the onChange() function is loaded before the onLoad.

And that is where i call the function that initiate all my values, could that really be?

[toc] | [next] | [standalone]

#23490

2014-03-10 2:06, jonas.thornvall@gmail.com wrote:

> I use body onLoad and checkbox onChange "outside form". While
> sorting out initiation bugs of values in script it seems like the
> onChange() function is loaded before the onLoad.
>
> And that is where i call the function that initiate all my values,
> could that really be?

Please show a sample HTML document that actually demonstrates this, and
explain why you think onchange is called before onload (and why it is 
called at all - what user action would trigger it?).

-- 
Yucca, http://www.cs.tut.fi/~jkorpela/

[toc] | [prev] | [next] | [standalone]

#23492

"Jukka K. Korpela" <jkorpela@cs.tut.fi> wrote on 10 mrt 2014 in 
comp.lang.javascript:

> 2014-03-10 2:06, jonas.thornvall@gmail.com wrote:
> 
>> I use body onLoad and checkbox onChange "outside form". While
>> sorting out initiation bugs of values in script it seems like the
>> onChange() function is loaded before the onLoad.
>>
>> And that is where i call the function that initiate all my values,
>> could that really be?
> 
> Please show a sample HTML document that actually demonstrates this, and
> explain why you think onchange is called before onload (and why it is 
> called at all - what user action would trigger it?).

I remember we had a beautifull checkbox onChange outside form some years 
ago, I fear our then form conscious maid threw it away as a load of garbage
while performing her initiation rite. She surely had her own set of values.

-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#23495

Den måndagen den 10:e mars 2014 kl. 09:49:16 UTC+1 skrev Evertjan.:
> "Jukka K. Korpela" <jkorpela@cs.tut.fi> wrote on 10 mrt 2014 in 
> 
> comp.lang.javascript:
> 
> 
> 
> > 2014-03-10 2:06, jonas.thornvall@gmail.com wrote:
> 
> > 
> 
> >> I use body onLoad and checkbox onChange "outside form". While
> 
> >> sorting out initiation bugs of values in script it seems like the
> 
> >> onChange() function is loaded before the onLoad.
> 
> >>
> 
> >> And that is where i call the function that initiate all my values,
> 
> >> could that really be?
> 
> > 
> 
> > Please show a sample HTML document that actually demonstrates this, and
> 
> > explain why you think onchange is called before onload (and why it is 
> 
> > called at all - what user action would trigger it?).
> 
> 
> 
> I remember we had a beautifull checkbox onChange outside form some years 
> 
> ago, I fear our then form conscious maid threw it away as a load of garbage
> 
> while performing her initiation rite. She surely had her own set of values.
> 
> 
> 
> -- 
> 
> Evertjan.
> 
> The Netherlands.
> 
> (Please change the x'es to dots in my emailaddress)

I am not sure what you are hinting on here i do know the form and table calls not that pretty, and it is probably true i should make everything in canvas.

Do you have an idea what is going wrong, and is there an easy fix?
It seem weird that all program logic break down when modularise the code a bit.

According to firebug is has something todo with arr[k] and arr[number] not being defined. 

But i create the objects global and k is just a local counter var used to set color, and number a global counter to fetch color property of object.

[toc] | [prev] | [next] | [standalone]

#23497

jonas.thornvall@gmail.com wrote on 10 mrt 2014 in 
comp.lang.javascript:

[..]

> I am not sure what you are hinting on here i do know 
> the form and table calls not that pretty, and it is 
> probably true i should make everything in canvas. 

As also hinted at by Jukka, we have no idea without you 
showning the problematic code.

"checkbox onChange outside form" does not mean a thing to 
me.

Others might be tempted to respond just quessing what you 
mean, but that would not help you, or worse make it a total 
mess. 

What is a "form and table call", btw, what is called?
 
> Do you have an idea what is going wrong, 

No. 

Most probably your coding is at fault, in the sense that 
you expect it to do something else than it does.

> and is there an easy fix?

Who can say?

> It seem weird that a .... [..]

You are explaining how you think your code should work,
but we do not know what code.

Please do not send us your full code, but a minimalistic 
example that gives the dreaded behavour.

An url would do even better [possibly].

-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#23493

Den måndagen den 10:e mars 2014 kl. 06:22:29 UTC+1 skrev Jukka K. Korpela:
> 2014-03-10 2:06, jonas.thornvall@gmail.com wrote:
> 
> 
> 
> > I use body onLoad and checkbox onChange "outside form". While
> 
> > sorting out initiation bugs of values in script it seems like the
> 
> > onChange() function is loaded before the onLoad.
> 
> >
> 
> > And that is where i call the function that initiate all my values,
> 
> > could that really be?
> 
> 
> 
> Please show a sample HTML document that actually demonstrates this, and
> 
> explain why you think onchange is called before onload (and why it is 
> 
> called at all - what user action would trigger it?).
> 
> 
> 
> -- 
> 
> Yucca, http://www.cs.tut.fi/~jkorpela/

Thanks for your reply Jukka.
I will try explain code briefly i create the array objects global to make them accessible Before changing color of objects. I have a function recheck that is called onChange() in the HTML. 
This functions is also called from HTML onLoad() by function 
firt_call()---->recheck();

It seem my global initiation and creaton of objects do not work which i find strange. I am quite sure that the recheck() is somehow called Before the global objects created. 

I just no not understand how which make it a bugger to fix.
Here is my selfstyled code be careful with the google inserted none ascii linebreaks if copy paste, those have to be removed there is online Tools but i forgot the site.


<!DOCTYPE html>
<html>
<head>
    <meta http-Equiv="Cache-Control" Content="no-cache">
    <meta http-Equiv="Pragma" Content="no-cache">
    <meta http-Equiv="Expires" Content="0">
</head>

<body onload=first_call();>

<div id="container" style="width:2100px">

<div id="header" style="background-color:#FFA500;">
<table width=2100 border="2" bgcolor="White" ><tr><td>
<B>PRIME EXPLORER v0.82 Bugs stills here but replaced FRAMES with DIV<font size=1></B>jonas.thornvall@hotmail.com</font></td>
</tr></table>

</div>

<div id="menu" style="background-color:lightgray;height:2000px;width:140px;float:left;">

<FONT=BOLD>

<table border="2" bgcolor="grey" width=140>

<tr>
<td align=middle bgcolor="yellow">+<BR><input type="checkbox" id="pos" name="pos" onchange=recheck(); checked="yes"></td>
<td align=middle bgcolor="lightgrey">-<BR><input type="checkbox" id="neg" name="neg" onchange=recheck(); checked="no"></td>
<td align=middle bgcolor="blue">P<input id="p" type="checkbox" name="p" onchange=recheck(); checked="yes"></td>
<td align=middle bgcolor="red">Sq<input type="checkbox" name="sq" id="sq" onchange=recheck(); checked="yes"></td>
</tr>
<tr>
<td align=middle bgcolor="pink">O <BR><input type="checkbox" name="o" id="o"  onchange=recheck(); checked="yes"></td>
<td align=middle bgcolor="lightblue">E <input type="checkbox" name="e" id="e" onchange=recheck(); checked="yes"></td>
</tr>

</table>

<table border="2" bgcolor="grey" width=140><tr><td>
<FORM NAME=Jdoit onSubmit="setmax(); return false;">
<input type=submit value="N max">
<input type="text" name="rangeN" value="4900" size="6">
</FORM>
</td></tr></table>

<table border="2" bgcolor="white" width=140><tr><td bgcolor="green">
<FORM NAME=Edoit onSubmit="initanime(); return false;">
<input type=submit name="init_anime" value="Anim"></FORM></td>
<td bgcolor="red">
<FORM NAME=Fdoit onSubmit="stopanime(); return false;">
<input type=submit name="stop_anime" value="haltA">
</FORM>
</td></tr></table>

<table border="2" bgcolor="Yellow" width=140><tr><td>
<FORM NAME=Xdoit onSubmit="startPos(); return false;">
<input type=submit value="setPos">
<input type="text" name="start_At" value="1" size="4">
</FORM>
</td></tr></table>

<table border="2" bgcolor="yellow" width=140><tr><td>
<FORM NAME=Adoit onSubmit="next(); return false;">
<input type=submit value="Forw">
</FORM> </td><td>

<FORM NAME=Bdoit onSubmit="prev(); return false;">
<input type=submit value="Backw">
</FORM>
</td></tr></table>

<table border="1" bgcolor="grey" width=140><tr><td>
<FORM NAME=Cdoit onSubmit="zoomin(); return false;">
<input type=submit name="zoom_in" value="Zoom+"><P>
</FORM>
</td><td>
<FORM NAME=Ddoit onSubmit="zoomout(); return false;">
<input type=submit name="zoom_out" value="Zoom-"><P>
</FORM>
</td></tr></table>

<table border="2" bgcolor="grey" width=140><tr><td>
<FORM NAME=Gdoit onSubmit="stopzoom(); return false;">
<input type=submit name="stop_zoom" value="stopZoom Anim">
</FORM>
</td></tr><tr><td>
<FORM NAME=Zdoit onSubmit="square_size(); return false;">
<input type=submit value="SQ size">
<input type="text" name="sqsize" value="2" size="3"><br>
</FORM>
</td></tr></table>

<table border="2" bgcolor="yellow" width=140><tr><td colspan="2">
<FORM NAME=Ldoit onSubmit="offset(); return false;">
<input type=submit value="N offset Col/Row">
</td></tr><tr><td>
X-<input type="text" name="xledf" value="1" size="2"></td><td>
Y-<input type="text" name="yledf" value="0" size="2">
</FORM>
</td></tr></table>
<table border="2" bgcolor="yellow" width=140><tr><td>
<FORM NAME=xplus onSubmit="plusX(); return false;">
<input type=submit name="x_plus" value="X+">
</FORM>

</td><td>
<FORM NAME=xminus onSubmit="minusX(); return false;">
<input type=submit name="x_minus" value="X-">
</FORM>
</td></tr><tr><td>

<FORM NAME=yplus onSubmit="plusY(); return false;">
<input type=submit name="y_plus" value="Y+">
</FORM>
</td><td>

<FORM NAME=yminus onSubmit="minusY(); return false;">
<input type=submit name="y_minus" value="Y-">
</FORM>
</td></tr></table>
</div>





<div id="content" style="background-color:lightyellow;height:1900px;width:1900;float:left;">
<canvas id="myCanvas" width="1900" height="1900">Your browser does not support the HTML5 canvas tag.</canvas>
<script type="text/javascript">

// Startvalues
var numberStart = document.Xdoit.start_At.value * 1;
// Numberrange
var  numbRange = document.Jdoit.rangeN.value * 1;
// Square_size
var divisorGlobal = document.Zdoit.sqsize.value * 1;
var MAX = 0;
var array = [];
var size = 0;
var run = 0;
var back = 0;
var down = 0;
adder = 0;
refresh = 5;
var arr = [];
var width = 0;
var height = 0;

for (var i = numberStart; i < numbRange; i ++ )
{
   var obj =
   {
      count : i,
      fcolor : 'black',
      rheight : 100,
      rwidth : 100,
      rcolor : 'white'
   }
   ;
   arr.push(obj);
}


// Calculate size of square to printout
function calc_square()
{
   MAX = Math.sqrt(numbRange);
   MAX = MAX * MAX;
}

// Calculate primes in range
function isPrime()
{
   n = MAX;
   // Eratosthenes algorithm to find all primes under n
   upperLimit = Math.sqrt(n);

   // Make an array from 2 to (n - 1)
   array[0] = false;
   array[1] = false;
   for (var i = 0; i < n; i ++ )
   {
      array.push(true);
   }

   // Remove multiples of primes starting from 2, 3, 5, ...
   i = 2;
   while (i <= upperLimit)
   {
      if (array[i])
      {
         for (var j = i * i; j < n; j += i)
         {
            array[j] = false;

         }
      }
      i ++ ;
   }
   return array;
}






// HERE IS THE DRAW FUNCTIONS

function clear()
{
   ctx.clearRect(0, 0, 2150, 2150);
}


function init()
{

   down = yyled;
   back = xxled;
   v_inner = 0;
   h_inner = 0;
   h_outer = 0;
   v_outer = 0;
   vcoffset = 0;
   hcoffset = 0;

   if(run = 1)numberStart = numberStart + adder;
   number = numberStart;
   h_outer = asize * (back);
   if (xxled < 0)
   {
      vcoffset = (xxled * - asize);
   }
   if (yyled < - 0)
   {
      hcoffset = (yyled * - asize);
   }


}

function redraw()
{
   clear();
   init();
   paint_logic();
}

function paint_out()
{
   ctx.fillStyle = arr[number].rcolor;
   ctx.fillRect(h_inner + vcoffset, v_inner + hcoffset, width, height);
   // Write out numbers
   ctx.fillStyle = 'black';
   if (divisor < 4)ctx.fillText(number, h_inner + 3 + vcoffset, v_inner + 15 + hcoffset);
}


function paint_logic()
{
   while(number < MAX)
   {
      document.Xdoit.start_At.value = numberStart;
      vertical = 0;
      v_outer = 0;
      v_inner = v_outer;
      h_inner = h_outer;
      square = 0;
      negsquare = 0;

      while(vertical < down)
      {
         if (number == 0) number ++ ;

         paint_out();
         v_inner = v_inner + asize;
         vertical ++ ;
         number ++ ;
      }
      down ++ ;
      horisontal = 0;
      h_inner = h_outer;

      while(horisontal < back)
      {
         if (number == 0) number ++ ;
         paint_out();
         h_inner = h_inner - asize;
         horisontal ++ ;
         number ++ ;
      }
      back ++ ;
      h_outer = h_outer + asize;
   }
   number ++ ;
}


// HERE IS ANIMATION FUNCTIONS

function initanime()
{
   // CALLED FROM FORM
   size = 0;
   adder = 1;
   run = 1;
   refresh = setInterval(redraw, 1);
}

function stopanime()
{
   // CALLED FROM FORM
   adder = 0;
   size = 0;
   clearInterval(refresh);
}


// MANIPULATE OUTPUT FUNCTIONS

function startPos()
{

   numberStart = document.Xdoit.start_At.value * 1;
   redraw();
}

function next()
{

   size = 0;
   adder = + 1;
   redraw();
}

function prev()
{
   size = 0;
   adder = - 1;
   redraw();
}


function setmax()
{

   numbRange = document.Jdoit.rangeN.value * 1;
   // document.write(numbRange);
   // p.stop();
   calc_square();
   isPrime();
   redraw();
}


function stopzoom()
{
   size = 0;
   redraw();
}

function zoomin()
{
   adder = 0;
   size = size - 1;
   size_font_square();
   redraw();
}

function zoomout()
{
   adder = 0;
   size = size + 1;
   size_font_square()
   redraw();
}

function square_size()
{
   size = 0;
   divisorGlobal = document.Zdoit.sqsize.value * 1;
   size_font_square()
   redraw();
}

function offset()
{
   size = 0;
   adder = 0;
   xxled = document.Ldoit.xledf.value
   yyled = document.Ldoit.yledf.value
   redraw();
}

function plusX()
{

   xxled ++ ;
   document.Ldoit.xledf.value = xxled;
   redraw();
}

function minusX()
{

   xxled -- ;
   document.Ldoit.xledf.value = xxled;
   redraw();
}

function plusY()
{

   yyled ++ ;
   document.Ldoit.yledf.value = yyled;
   redraw();
}

function minusY()
{

   yyled -- ;
   document.Ldoit.yledf.value = yyled;
   redraw();
}

// Set paintout size
function size_font_square()
{

   divisorGlobal = divisorGlobal + size;

   // Set size range 1 -> 100
   if (divisorGlobal == 0)
   {
      divisorGlobal = 1;
   }
   else if (divisorGlobal > 100)
   {
      divisorGlobal = divisorGlobal - 1;
   }
   // Write out Zoom factor to form
   document.Zdoit.sqsize.value = divisorGlobal;
   // Global magnitude objects
   divisor = divisorGlobal;
   // Set fontsize
   fstor = 17 / divisor;
   ctx.font = "" + fstor + "px Arial";
   // Set distance squares
   asize = 67 / divisor;
   // Set square size
   storlek = 54;
   height = storlek / divisor;
   width = storlek / divisor;
}

// THIS IS MAIN FORM CALL AT LOAD

function first_call()
{
   canvas = document.getElementById("myCanvas");
   ctx = canvas.getContext("2d");
   // Fetch offset X and Y
   xxled = document.Ldoit.xledf.value * 1;
   yyled = document.Ldoit.yledf.value * 1;
   isPrime();
   calc_square();
   size_font_square();
   recheck();
}

// HERE IS FUNCTIONS REACTING AT CHANGE OF CHECKBOXES

function recheck()
{
   notchecked();
   if (document.getElementById('pos').checked == true)
   {
      pos_checked();

   }
   if (document.getElementById('neg').checked == true)
   {
      neg_checked();

   }
   if (document.getElementById('o').checked == true)
   {
      odd_checked();

   }
   if (document.getElementById('e').checked == true)
   {
      even_checked();

   }
   if (document.getElementById('p').checked == true)
   {
      prime_checked();

   }
   if (document.getElementById('sq').checked == true)
   {
      square_checked();

   }
   redraw();
}

function notchecked()
{
   // document.write(numbRange); p.stop();
   for (var k = numberStart; k < numbRange; k ++ )
   {
      arr[k].rcolor = 'green';
   }
}


function square_checked()
{

   for (var k = numberStart; k < numbRange; k ++ )
   {
      square = Math.sqrt(k, 2);
      negsquare = Math.sqrt( - k, 2);
      if(square - Math.floor(square) == 0)  arr[k].rcolor = 'red';
      if(k < 0 && negsquare - Math.floor(negsquare) == 0) arr[k].rcolor = 'orange';
      ;

   }

}

function prime_checked()
{
   for (var k = numberStart; k < numbRange; k ++ )
   {
      if((array[k]) == true ) arr[k].rcolor = 'blue';
   }
}

function pos_checked()
{
   for (var k = numberStart; k < numbRange; k ++ )
   {
      if(k > 0) arr[k].rcolor = 'yellow';
   }
}

function neg_checked()
{
   for (var k = numberStart; k < numbRange; k ++ )
   {
      if(k < 0) arr[k].rcolor = 'gray';
   }
}

function odd_checked()
{
   for (var k = numberStart; k < numbRange; k ++ )
   {
      if((k / 2) % 1 != 0) arr[k].rcolor = 'pink';
   }
}

function even_checked()
{
   for (var k = numberStart; k < numbRange; k ++ )
   {
      if((k / 2) % 1 == 0) arr[k].rcolor = 'lightblue';
   }
}

</script>

</div>

<div id="footer" style="background-color:lightblue;clear:both;text-align:center;">
Copyright © Jonas Thörnvall</div>

</div>

</body>
</html>

[toc] | [prev] | [next] | [standalone]

#23494

Den måndagen den 10:e mars 2014 kl. 13:17:24 UTC+1 skrev jonas.t...@gmail.com:
> Den måndagen den 10:e mars 2014 kl. 06:22:29 UTC+1 skrev Jukka K. Korpela:
> 
> > 2014-03-10 2:06, jonas.thornvall@gmail.com wrote:
> 
> > 
> 
> > 
> 
> > 
> 
> > > I use body onLoad and checkbox onChange "outside form". While
> 
> > 
> 
> > > sorting out initiation bugs of values in script it seems like the
> 
> > 
> 
> > > onChange() function is loaded before the onLoad.
> 
> > 
> 
> > >
> 
> > 
> 
> > > And that is where i call the function that initiate all my values,
> 
> > 
> 
> > > could that really be?
> 
> > 
> 
> > 
> 
> > 
> 
> > Please show a sample HTML document that actually demonstrates this, and
> 
> > 
> 
> > explain why you think onchange is called before onload (and why it is 
> 
> > 
> 
> > called at all - what user action would trigger it?).
> 
> > 
> 
> > 
> 
> > 
> 
> > -- 
> 
> > 
> 
> > Yucca, http://www.cs.tut.fi/~jkorpela/
> 
> 
> 
> Thanks for your reply Jukka.
> 
> I will try explain code briefly i create the array objects global to make them accessible Before changing color of objects. I have a function recheck that is called onChange() in the HTML. 
> 
> This functions is also called from HTML onLoad() by function 
> 
> firt_call()---->recheck();
> 
> 
> 
> It seem my global initiation and creaton of objects do not work which i find strange. I am quite sure that the recheck() is somehow called Before the global objects created. 
> 
> 
> 
> I just no not understand how which make it a bugger to fix.
> 
> Here is my selfstyled code be careful with the google inserted none ascii linebreaks if copy paste, those have to be removed there is online Tools but i forgot the site.
> 
> 
> 
> 
> 
> <!DOCTYPE html>
> 
> <html>
> 
> <head>
> 
>     <meta http-Equiv="Cache-Control" Content="no-cache">
> 
>     <meta http-Equiv="Pragma" Content="no-cache">
> 
>     <meta http-Equiv="Expires" Content="0">
> 
> </head>
> 
> 
> 
> <body onload=first_call();>
> 
> 
> 
> <div id="container" style="width:2100px">
> 
> 
> 
> <div id="header" style="background-color:#FFA500;">
> 
> <table width=2100 border="2" bgcolor="White" ><tr><td>
> 
> <B>PRIME EXPLORER v0.82 Bugs stills here but replaced FRAMES with DIV<font size=1></B>jonas.thornvall@hotmail.com</font></td>
> 
> </tr></table>
> 
> 
> 
> </div>
> 
> 
> 
> <div id="menu" style="background-color:lightgray;height:2000px;width:140px;float:left;">
> 
> 
> 
> <FONT=BOLD>
> 
> 
> 
> <table border="2" bgcolor="grey" width=140>
> 
> 
> 
> <tr>
> 
> <td align=middle bgcolor="yellow">+<BR><input type="checkbox" id="pos" name="pos" onchange=recheck(); checked="yes"></td>
> 
> <td align=middle bgcolor="lightgrey">-<BR><input type="checkbox" id="neg" name="neg" onchange=recheck(); checked="no"></td>
> 
> <td align=middle bgcolor="blue">P<input id="p" type="checkbox" name="p" onchange=recheck(); checked="yes"></td>
> 
> <td align=middle bgcolor="red">Sq<input type="checkbox" name="sq" id="sq" onchange=recheck(); checked="yes"></td>
> 
> </tr>
> 
> <tr>
> 
> <td align=middle bgcolor="pink">O <BR><input type="checkbox" name="o" id="o"  onchange=recheck(); checked="yes"></td>
> 
> <td align=middle bgcolor="lightblue">E <input type="checkbox" name="e" id="e" onchange=recheck(); checked="yes"></td>
> 
> </tr>
> 
> 
> 
> </table>
> 
> 
> 
> <table border="2" bgcolor="grey" width=140><tr><td>
> 
> <FORM NAME=Jdoit onSubmit="setmax(); return false;">
> 
> <input type=submit value="N max">
> 
> <input type="text" name="rangeN" value="4900" size="6">
> 
> </FORM>
> 
> </td></tr></table>
> 
> 
> 
> <table border="2" bgcolor="white" width=140><tr><td bgcolor="green">
> 
> <FORM NAME=Edoit onSubmit="initanime(); return false;">
> 
> <input type=submit name="init_anime" value="Anim"></FORM></td>
> 
> <td bgcolor="red">
> 
> <FORM NAME=Fdoit onSubmit="stopanime(); return false;">
> 
> <input type=submit name="stop_anime" value="haltA">
> 
> </FORM>
> 
> </td></tr></table>
> 
> 
> 
> <table border="2" bgcolor="Yellow" width=140><tr><td>
> 
> <FORM NAME=Xdoit onSubmit="startPos(); return false;">
> 
> <input type=submit value="setPos">
> 
> <input type="text" name="start_At" value="1" size="4">
> 
> </FORM>
> 
> </td></tr></table>
> 
> 
> 
> <table border="2" bgcolor="yellow" width=140><tr><td>
> 
> <FORM NAME=Adoit onSubmit="next(); return false;">
> 
> <input type=submit value="Forw">
> 
> </FORM> </td><td>
> 
> 
> 
> <FORM NAME=Bdoit onSubmit="prev(); return false;">
> 
> <input type=submit value="Backw">
> 
> </FORM>
> 
> </td></tr></table>
> 
> 
> 
> <table border="1" bgcolor="grey" width=140><tr><td>
> 
> <FORM NAME=Cdoit onSubmit="zoomin(); return false;">
> 
> <input type=submit name="zoom_in" value="Zoom+"><P>
> 
> </FORM>
> 
> </td><td>
> 
> <FORM NAME=Ddoit onSubmit="zoomout(); return false;">
> 
> <input type=submit name="zoom_out" value="Zoom-"><P>
> 
> </FORM>
> 
> </td></tr></table>
> 
> 
> 
> <table border="2" bgcolor="grey" width=140><tr><td>
> 
> <FORM NAME=Gdoit onSubmit="stopzoom(); return false;">
> 
> <input type=submit name="stop_zoom" value="stopZoom Anim">
> 
> </FORM>
> 
> </td></tr><tr><td>
> 
> <FORM NAME=Zdoit onSubmit="square_size(); return false;">
> 
> <input type=submit value="SQ size">
> 
> <input type="text" name="sqsize" value="2" size="3"><br>
> 
> </FORM>
> 
> </td></tr></table>
> 
> 
> 
> <table border="2" bgcolor="yellow" width=140><tr><td colspan="2">
> 
> <FORM NAME=Ldoit onSubmit="offset(); return false;">
> 
> <input type=submit value="N offset Col/Row">
> 
> </td></tr><tr><td>
> 
> X-<input type="text" name="xledf" value="1" size="2"></td><td>
> 
> Y-<input type="text" name="yledf" value="0" size="2">
> 
> </FORM>
> 
> </td></tr></table>
> 
> <table border="2" bgcolor="yellow" width=140><tr><td>
> 
> <FORM NAME=xplus onSubmit="plusX(); return false;">
> 
> <input type=submit name="x_plus" value="X+">
> 
> </FORM>
> 
> 
> 
> </td><td>
> 
> <FORM NAME=xminus onSubmit="minusX(); return false;">
> 
> <input type=submit name="x_minus" value="X-">
> 
> </FORM>
> 
> </td></tr><tr><td>
> 
> 
> 
> <FORM NAME=yplus onSubmit="plusY(); return false;">
> 
> <input type=submit name="y_plus" value="Y+">
> 
> </FORM>
> 
> </td><td>
> 
> 
> 
> <FORM NAME=yminus onSubmit="minusY(); return false;">
> 
> <input type=submit name="y_minus" value="Y-">
> 
> </FORM>
> 
> </td></tr></table>
> 
> </div>
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> <div id="content" style="background-color:lightyellow;height:1900px;width:1900;float:left;">
> 
> <canvas id="myCanvas" width="1900" height="1900">Your browser does not support the HTML5 canvas tag.</canvas>
> 
> <script type="text/javascript">
> 
> 
> 
> // Startvalues
> 
> var numberStart = document.Xdoit.start_At.value * 1;
> 
> // Numberrange
> 
> var  numbRange = document.Jdoit.rangeN.value * 1;
> 
> // Square_size
> 
> var divisorGlobal = document.Zdoit.sqsize.value * 1;
> 
> var MAX = 0;
> 
> var array = [];
> 
> var size = 0;
> 
> var run = 0;
> 
> var back = 0;
> 
> var down = 0;
> 
> adder = 0;
> 
> refresh = 5;
> 
> var arr = [];
> 
> var width = 0;
> 
> var height = 0;
> 
> 
> 
> for (var i = numberStart; i < numbRange; i ++ )
> 
> {
> 
>    var obj =
> 
>    {
> 
>       count : i,
> 
>       fcolor : 'black',
> 
>       rheight : 100,
> 
>       rwidth : 100,
> 
>       rcolor : 'white'
> 
>    }
> 
>    ;
> 
>    arr.push(obj);
> 
> }
> 
> 
> 
> 
> 
> // Calculate size of square to printout
> 
> function calc_square()
> 
> {
> 
>    MAX = Math.sqrt(numbRange);
> 
>    MAX = MAX * MAX;
> 
> }
> 
> 
> 
> // Calculate primes in range
> 
> function isPrime()
> 
> {
> 
>    n = MAX;
> 
>    // Eratosthenes algorithm to find all primes under n
> 
>    upperLimit = Math.sqrt(n);
> 
> 
> 
>    // Make an array from 2 to (n - 1)
> 
>    array[0] = false;
> 
>    array[1] = false;
> 
>    for (var i = 0; i < n; i ++ )
> 
>    {
> 
>       array.push(true);
> 
>    }
> 
> 
> 
>    // Remove multiples of primes starting from 2, 3, 5, ...
> 
>    i = 2;
> 
>    while (i <= upperLimit)
> 
>    {
> 
>       if (array[i])
> 
>       {
> 
>          for (var j = i * i; j < n; j += i)
> 
>          {
> 
>             array[j] = false;
> 
> 
> 
>          }
> 
>       }
> 
>       i ++ ;
> 
>    }
> 
>    return array;
> 
> }
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> // HERE IS THE DRAW FUNCTIONS
> 
> 
> 
> function clear()
> 
> {
> 
>    ctx.clearRect(0, 0, 2150, 2150);
> 
> }
> 
> 
> 
> 
> 
> function init()
> 
> {
> 
> 
> 
>    down = yyled;
> 
>    back = xxled;
> 
>    v_inner = 0;
> 
>    h_inner = 0;
> 
>    h_outer = 0;
> 
>    v_outer = 0;
> 
>    vcoffset = 0;
> 
>    hcoffset = 0;
> 
> 
> 
>    if(run = 1)numberStart = numberStart + adder;
> 
>    number = numberStart;
> 
>    h_outer = asize * (back);
> 
>    if (xxled < 0)
> 
>    {
> 
>       vcoffset = (xxled * - asize);
> 
>    }
> 
>    if (yyled < - 0)
> 
>    {
> 
>       hcoffset = (yyled * - asize);
> 
>    }
> 
> 
> 
> 
> 
> }
> 
> 
> 
> function redraw()
> 
> {
> 
>    clear();
> 
>    init();
> 
>    paint_logic();
> 
> }
> 
> 
> 
> function paint_out()
> 
> {
> 
>    ctx.fillStyle = arr[number].rcolor;
> 
>    ctx.fillRect(h_inner + vcoffset, v_inner + hcoffset, width, height);
> 
>    // Write out numbers
> 
>    ctx.fillStyle = 'black';
> 
>    if (divisor < 4)ctx.fillText(number, h_inner + 3 + vcoffset, v_inner + 15 + hcoffset);
> 
> }
> 
> 
> 
> 
> 
> function paint_logic()
> 
> {
> 
>    while(number < MAX)
> 
>    {
> 
>       document.Xdoit.start_At.value = numberStart;
> 
>       vertical = 0;
> 
>       v_outer = 0;
> 
>       v_inner = v_outer;
> 
>       h_inner = h_outer;
> 
>       square = 0;
> 
>       negsquare = 0;
> 
> 
> 
>       while(vertical < down)
> 
>       {
> 
>          if (number == 0) number ++ ;
> 
> 
> 
>          paint_out();
> 
>          v_inner = v_inner + asize;
> 
>          vertical ++ ;
> 
>          number ++ ;
> 
>       }
> 
>       down ++ ;
> 
>       horisontal = 0;
> 
>       h_inner = h_outer;
> 
> 
> 
>       while(horisontal < back)
> 
>       {
> 
>          if (number == 0) number ++ ;
> 
>          paint_out();
> 
>          h_inner = h_inner - asize;
> 
>          horisontal ++ ;
> 
>          number ++ ;
> 
>       }
> 
>       back ++ ;
> 
>       h_outer = h_outer + asize;
> 
>    }
> 
>    number ++ ;
> 
> }
> 
> 
> 
> 
> 
> // HERE IS ANIMATION FUNCTIONS
> 
> 
> 
> function initanime()
> 
> {
> 
>    // CALLED FROM FORM
> 
>    size = 0;
> 
>    adder = 1;
> 
>    run = 1;
> 
>    refresh = setInterval(redraw, 1);
> 
> }
> 
> 
> 
> function stopanime()
> 
> {
> 
>    // CALLED FROM FORM
> 
>    adder = 0;
> 
>    size = 0;
> 
>    clearInterval(refresh);
> 
> }
> 
> 
> 
> 
> 
> // MANIPULATE OUTPUT FUNCTIONS
> 
> 
> 
> function startPos()
> 
> {
> 
> 
> 
>    numberStart = document.Xdoit.start_At.value * 1;
> 
>    redraw();
> 
> }
> 
> 
> 
> function next()
> 
> {
> 
> 
> 
>    size = 0;
> 
>    adder = + 1;
> 
>    redraw();
> 
> }
> 
> 
> 
> function prev()
> 
> {
> 
>    size = 0;
> 
>    adder = - 1;
> 
>    redraw();
> 
> }
> 
> 
> 
> 
> 
> function setmax()
> 
> {
> 
> 
> 
>    numbRange = document.Jdoit.rangeN.value * 1;
> 
>    // document.write(numbRange);
> 
>    // p.stop();
> 
>    calc_square();
> 
>    isPrime();
> 
>    redraw();
> 
> }
> 
> 
> 
> 
> 
> function stopzoom()
> 
> {
> 
>    size = 0;
> 
>    redraw();
> 
> }
> 
> 
> 
> function zoomin()
> 
> {
> 
>    adder = 0;
> 
>    size = size - 1;
> 
>    size_font_square();
> 
>    redraw();
> 
> }
> 
> 
> 
> function zoomout()
> 
> {
> 
>    adder = 0;
> 
>    size = size + 1;
> 
>    size_font_square()
> 
>    redraw();
> 
> }
> 
> 
> 
> function square_size()
> 
> {
> 
>    size = 0;
> 
>    divisorGlobal = document.Zdoit.sqsize.value * 1;
> 
>    size_font_square()
> 
>    redraw();
> 
> }
> 
> 
> 
> function offset()
> 
> {
> 
>    size = 0;
> 
>    adder = 0;
> 
>    xxled = document.Ldoit.xledf.value
> 
>    yyled = document.Ldoit.yledf.value
> 
>    redraw();
> 
> }
> 
> 
> 
> function plusX()
> 
> {
> 
> 
> 
>    xxled ++ ;
> 
>    document.Ldoit.xledf.value = xxled;
> 
>    redraw();
> 
> }
> 
> 
> 
> function minusX()
> 
> {
> 
> 
> 
>    xxled -- ;
> 
>    document.Ldoit.xledf.value = xxled;
> 
>    redraw();
> 
> }
> 
> 
> 
> function plusY()
> 
> {
> 
> 
> 
>    yyled ++ ;
> 
>    document.Ldoit.yledf.value = yyled;
> 
>    redraw();
> 
> }
> 
> 
> 
> function minusY()
> 
> {
> 
> 
> 
>    yyled -- ;
> 
>    document.Ldoit.yledf.value = yyled;
> 
>    redraw();
> 
> }
> 
> 
> 
> // Set paintout size
> 
> function size_font_square()
> 
> {
> 
> 
> 
>    divisorGlobal = divisorGlobal + size;
> 
> 
> 
>    // Set size range 1 -> 100
> 
>    if (divisorGlobal == 0)
> 
>    {
> 
>       divisorGlobal = 1;
> 
>    }
> 
>    else if (divisorGlobal > 100)
> 
>    {
> 
>       divisorGlobal = divisorGlobal - 1;
> 
>    }
> 
>    // Write out Zoom factor to form
> 
>    document.Zdoit.sqsize.value = divisorGlobal;
> 
>    // Global magnitude objects
> 
>    divisor = divisorGlobal;
> 
>    // Set fontsize
> 
>    fstor = 17 / divisor;
> 
>    ctx.font = "" + fstor + "px Arial";
> 
>    // Set distance squares
> 
>    asize = 67 / divisor;
> 
>    // Set square size
> 
>    storlek = 54;
> 
>    height = storlek / divisor;
> 
>    width = storlek / divisor;
> 
> }
> 
> 
> 
> // THIS IS MAIN FORM CALL AT LOAD
> 
> 
> 
> function first_call()
> 
> {
> 
>    canvas = document.getElementById("myCanvas");
> 
>    ctx = canvas.getContext("2d");
> 
>    // Fetch offset X and Y
> 
>    xxled = document.Ldoit.xledf.value * 1;
> 
>    yyled = document.Ldoit.yledf.value * 1;
> 
>    isPrime();
> 
>    calc_square();
> 
>    size_font_square();
> 
>    recheck();
> 
> }
> 
> 
> 
> // HERE IS FUNCTIONS REACTING AT CHANGE OF CHECKBOXES
> 
> 
> 
> function recheck()
> 
> {
> 
>    notchecked();
> 
>    if (document.getElementById('pos').checked == true)
> 
>    {
> 
>       pos_checked();
> 
> 
> 
>    }
> 
>    if (document.getElementById('neg').checked == true)
> 
>    {
> 
>       neg_checked();
> 
> 
> 
>    }
> 
>    if (document.getElementById('o').checked == true)
> 
>    {
> 
>       odd_checked();
> 
> 
> 
>    }
> 
>    if (document.getElementById('e').checked == true)
> 
>    {
> 
>       even_checked();
> 
> 
> 
>    }
> 
>    if (document.getElementById('p').checked == true)
> 
>    {
> 
>       prime_checked();
> 
> 
> 
>    }
> 
>    if (document.getElementById('sq').checked == true)
> 
>    {
> 
>       square_checked();
> 
> 
> 
>    }
> 
>    redraw();
> 
> }
> 
> 
> 
> function notchecked()
> 
> {
> 
>    // document.write(numbRange); p.stop();
> 
>    for (var k = numberStart; k < numbRange; k ++ )
> 
>    {
> 
>       arr[k].rcolor = 'green';
> 
>    }
> 
> }
> 
> 
> 
> 
> 
> function square_checked()
> 
> {
> 
> 
> 
>    for (var k = numberStart; k < numbRange; k ++ )
> 
>    {
> 
>       square = Math.sqrt(k, 2);
> 
>       negsquare = Math.sqrt( - k, 2);
> 
>       if(square - Math.floor(square) == 0)  arr[k].rcolor = 'red';
> 
>       if(k < 0 && negsquare - Math.floor(negsquare) == 0) arr[k].rcolor = 'orange';
> 
>       ;
> 
> 
> 
>    }
> 
> 
> 
> }
> 
> 
> 
> function prime_checked()
> 
> {
> 
>    for (var k = numberStart; k < numbRange; k ++ )
> 
>    {
> 
>       if((array[k]) == true ) arr[k].rcolor = 'blue';
> 
>    }
> 
> }
> 
> 
> 
> function pos_checked()
> 
> {
> 
>    for (var k = numberStart; k < numbRange; k ++ )
> 
>    {
> 
>       if(k > 0) arr[k].rcolor = 'yellow';
> 
>    }
> 
> }
> 
> 
> 
> function neg_checked()
> 
> {
> 
>    for (var k = numberStart; k < numbRange; k ++ )
> 
>    {
> 
>       if(k < 0) arr[k].rcolor = 'gray';
> 
>    }
> 
> }
> 
> 
> 
> function odd_checked()
> 
> {
> 
>    for (var k = numberStart; k < numbRange; k ++ )
> 
>    {
> 
>       if((k / 2) % 1 != 0) arr[k].rcolor = 'pink';
> 
>    }
> 
> }
> 
> 
> 
> function even_checked()
> 
> {
> 
>    for (var k = numberStart; k < numbRange; k ++ )
> 
>    {
> 
>       if((k / 2) % 1 == 0) arr[k].rcolor = 'lightblue';
> 
>    }
> 
> }
> 
> 
> 
> </script>
> 
> 
> 
> </div>
> 
> 
> 
> <div id="footer" style="background-color:lightblue;clear:both;text-align:center;">
> 
> Copyright © Jonas Thörnvall</div>
> 
> 
> 
> </div>
> 
> 
> 
> </body>
> 
> </html>

I try to learn howto use firebug but i really have some Catch up todo, the last editor i used and actually understood was the Borland Turbo Pascal, because it had these nice step into code functions and breaks and variable Watch. 

I really have trouble using understanding firebug, can i step into the function first call and run it linewise while checking variables, and will my global values be initiated if doing so?

I Think following the code stepwise line by line could make me understand what is going wrong. But i really Clueless about howto do it in Firebug.

[toc] | [prev] | [next] | [standalone]

#23496

2014-03-10 14:17, jonas.thornvall@gmail.com wrote:

> [...] i create
> the array objects global to make them accessible Before changing
> color of objects. I have a function recheck that is called onChange()
> in the HTML. This functions is also called from HTML onLoad() by
> function firt_call()---->recheck();
>
> It seem my global initiation and creaton of objects do not work which
> i find strange. I am quite sure that the recheck() is somehow called
> Before the global objects created.

Well, a simple way to check this is to put a console.log(...) statement 
at the start of the body of first_call() and at the start of the body of 
recheck(). It turns out that first_call() is called first, as we can expect.

The console log (on Chrome) then says:

"Uncaught TypeError: Cannot set property 'rcolor' of undefined"

at line 518. There might be something wrong with the way the arr[] array 
is indexed.

-- 
Yucca, http://www.cs.tut.fi/~jkorpela/

[toc] | [prev] | [next] | [standalone]

#23498

Den måndagen den 10:e mars 2014 kl. 15:00:03 UTC+1 skrev Jukka K. Korpela:
> 2014-03-10 14:17, jonas.thornvall@gmail.com wrote:
> 
> 
> 
> > [...] i create
> 
> > the array objects global to make them accessible Before changing
> 
> > color of objects. I have a function recheck that is called onChange()
> 
> > in the HTML. This functions is also called from HTML onLoad() by
> 
> > function firt_call()---->recheck();
> 
> >
> 
> > It seem my global initiation and creaton of objects do not work which
> 
> > i find strange. I am quite sure that the recheck() is somehow called
> 
> > Before the global objects created.
> 
> 
> 
> Well, a simple way to check this is to put a console.log(...) statement 
> 
> at the start of the body of first_call() and at the start of the body of 
> 
> recheck(). It turns out that first_call() is called first, as we can expect.
> 
> 
> 
> The console log (on Chrome) then says:
> 
> 
> 
> "Uncaught TypeError: Cannot set property 'rcolor' of undefined"
> 
> 
> 
> at line 518. There might be something wrong with the way the arr[] array 
> 
> is indexed.
> 
> 
> 
> -- 
> 
> Yucca, http://www.cs.tut.fi/~jkorpela/

Well at the global loop creation of objects they do get values from form.
startValue 1 and numbRange 4900.

numberStart = document.Xdoit.start_At.value * 1;
//document.write(numberStart);
//p.stop();
// Numberrange
numbRange = document.Jdoit.rangeN.value * 1;


for (var i = numberStart; i < numbRange; i ++ )
{
   var obj =
   {
      count : i,
      fcolor : 'black',
      rheight : 100,
      rwidth : 100,
      rcolor : 'white'
   }

   arr.push(obj);
}

So i expect there to be 4900 white colored objects.
And later i have the first_call() that call a recheck() of checkboxes where the first fucntion called is notchecked(); and the values for numberstart and numberrange is 1 and 4900 as expected.

function notchecked()
{
   // document.write(numberStart); p.stop();
   for (var k = numberStart; k < numbRange; k ++ )
   {
      arr[k].rcolor = 'green';
   }
}

So what is undefined here, i find it a mystery, it could be that i do not understand the object creation or it is simply wrong the way i do it?

[toc] | [prev] | [next] | [standalone]

#23499

jonas.thornvall@gmail.com wrote on 10 mrt 2014 in comp.lang.javascript:

> numberStart = document.Xdoit.start_At.value * 1;
> numbRange = document.Jdoit.rangeN.value * 1;

This is ancient IE code.

Is this really made by you?
I suggest you copied it from near prehistoric sources.

document should not be used by ids [or names] in this way,
most browser DOM's will error somewhere, I presume.

Try:

var numberStart = 
 +document.getElementById('Xdoit').getElementById('start_At').value;

Or:

var Xdoit = document.getElementById('Xdoit');
var Xdoit_start_At = Xdoit.getElementById('start_At');
var numberStart = +Xdoit_start_At.value;

=============

I repeat, show us a workable minimalistic example.

-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#23500

Den måndagen den 10:e mars 2014 kl. 15:46:09 UTC+1 skrev Evertjan.:
> jonas.thornvall@gmail.com wrote on 10 mrt 2014 in comp.lang.javascript:
> 
> 
> 
> > numberStart = document.Xdoit.start_At.value * 1;
> 
> > numbRange = document.Jdoit.rangeN.value * 1;
> 
> 
> 
> This is ancient IE code.
> 
> 
> 
> Is this really made by you?
> 
> I suggest you copied it from near prehistoric sources.
> 
> 
> 
> document should not be used by ids [or names] in this way,
> 
> most browser DOM's will error somewhere, I presume.
> 
> 
> 
> Try:
> 
> 
> 
> var numberStart = 
> 
>  +document.getElementById('Xdoit').getElementById('start_At').value;
> 
> 
> 
> Or:
> 
> 
> 
> var Xdoit = document.getElementById('Xdoit');
> 
> var Xdoit_start_At = Xdoit.getElementById('start_At');
> 
> var numberStart = +Xdoit_start_At.value;
> 
> 
> 
> =============
> 
> 
> 
> I repeat, show us a workable minimalistic example.
> 
> 
> 
> -- 
> 
> Evertjan.
> 
> The Netherlands.
> 
> (Please change the x'es to dots in my emailaddress)

Well i am a dinosaur, I have written a little javascript but mainly PHP in 2001, otherwise i am afraid my javascript knowledge ancient dating back to 96-98. And i write a bit of snippet now and then but this is a bit more elaborate with canvas and graphic and steering mechanism. 

So the truth i am really clueless about objects and elements. 
But i saw an example where they initiated objects the way i do.
And i found an example that used element id that worked for the checkboxes.

Regarding a working minimalistic example it will proof tough since the code started like a linear hack that was built out by steering logic using frames and forms.

But then i decided to make an attempt modularise and use an object, changed the HTML from frames to div. So it slowly going forward a day a week, but sometimes the new programming paradigm leads to hangups.

I have the same functionality working with HTML frames and ancient top down javascript approach. I think it prefers Iexplorer.

http://web.comhem.se/jonasth/

[toc] | [prev] | [next] | [standalone]

#23505

jonas.thornvall@gmail.com wrote on 10 mrt 2014 in comp.lang.javascript:

I wrote:
>> I repeat, show us a workable minimalistic example.

[please do not quote signatures on usenet. skipped]

Hi Jonas,

> Well i am a dinosaur, 

My javascript use reaches far back into the last century.

> I have written a little javascript but mainly PHP
> in 2001, otherwise i am afraid my javascript knowledge ancient dating
> back to 96-98. And i write a bit of snippet now and then but this is a
> bit more elaborate with canvas and graphic and steering mechanism. 

However, you should not perpetuate mistakes made by IE.
 
> So the truth i am really clueless about objects and elements. 

There is NO NEED for them, they are just magic in the hands of the ones who 
know how to use them.

It is far easier to programme with the experience you have and use only code 
you understand.

This will be better for your own "education permanente" too.

> But i saw an example where they initiated objects the way i do.
> And i found an example that used element id that worked for the
> checkboxes. 

But do you understand what happens?

> Regarding a working minimalistic example it will proof tough since the
> code started like a linear hack that was built out by steering logic
> using frames and forms. 

proof tough?

I don't think so, on the contrary it will perhaps get you to understand the 
code so well, that you come to your own solution.

> But then i decided to make an attempt modularise and use an object,
> changed the HTML from frames to div. So it slowly going forward a day a
> week, but sometimes the new programming paradigm leads to hangups.

In the end you will not have a managable code and page, meseems.

> I have the same functionality working with HTML frames and ancient top
> down javascript approach. I think it prefers Iexplorer. 

What do you allow your users to use for a browser? IE only?

Even so:

document.nameOrId.value

will lead to all kinds of errors, when your code gets more complex,
and you accidentally use a word that is native to the browser or is var-ed 
by you, or when the browser's engine simply does not understand it.

-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#23501

jonas.thornvall@gmail.com writes:

<snip>
> Well at the global loop creation of objects they do get values from form.
> startValue 1 and numbRange 4900.
>
> numberStart = document.Xdoit.start_At.value * 1;
> //document.write(numberStart);
> //p.stop();
> // Numberrange
> numbRange = document.Jdoit.rangeN.value * 1;
>
>
> for (var i = numberStart; i < numbRange; i ++ )
> {
>    var obj =
>    {
>       count : i,
>       fcolor : 'black',
>       rheight : 100,
>       rwidth : 100,
>       rcolor : 'white'
>    }
>
>    arr.push(obj);

This adds elements indexed from 0 to 4898.

> }
>
> So i expect there to be 4900 white colored objects.
> And later i have the first_call() that call a recheck() of checkboxes where the first fucntion called is notchecked(); and the values for numberstart and numberrange is 1 and 4900 as expected.
>
> function notchecked()
> {
>    // document.write(numberStart); p.stop();
>    for (var k = numberStart; k < numbRange; k ++ )
>    {
>       arr[k].rcolor = 'green';

This accesses elements indexed from 1 to 4899.

>    }
> }
>
> So what is undefined here,

arr[4899].

<snip>
-- 
Ben.

[toc] | [prev] | [next] | [standalone]

#23502

Den måndagen den 10:e mars 2014 kl. 18:03:33 UTC+1 skrev Ben Bacarisse:
> jonas.thornvall@gmail.com writes:
> 
> 
> 
> <snip>
> 
> > Well at the global loop creation of objects they do get values from form.
> 
> > startValue 1 and numbRange 4900.
> 
> >
> 
> > numberStart = document.Xdoit.start_At.value * 1;
> 
> > //document.write(numberStart);
> 
> > //p.stop();
> 
> > // Numberrange
> 
> > numbRange = document.Jdoit.rangeN.value * 1;
> 
> >
> 
> >
> 
> > for (var i = numberStart; i < numbRange; i ++ )
> 
> > {
> 
> >    var obj =
> 
> >    {
> 
> >       count : i,
> 
> >       fcolor : 'black',
> 
> >       rheight : 100,
> 
> >       rwidth : 100,
> 
> >       rcolor : 'white'
> 
> >    }
> 
> >
> 
> >    arr.push(obj);
> 
> 
> 
> This adds elements indexed from 0 to 4898.
> 
> 
> 
> > }
> 
> >
> 
> > So i expect there to be 4900 white colored objects.
> 
> > And later i have the first_call() that call a recheck() of checkboxes where the first fucntion called is notchecked(); and the values for numberstart and numberrange is 1 and 4900 as expected.
> 
> >
> 
> > function notchecked()
> 
> > {
> 
> >    // document.write(numberStart); p.stop();
> 
> >    for (var k = numberStart; k < numbRange; k ++ )
> 
> >    {
> 
> >       arr[k].rcolor = 'green';
> 
> 
> 
> This accesses elements indexed from 1 to 4899.
> 
> 
> 
> >    }
> 
> > }
> 
> >
> 
> > So what is undefined here,
> 
> 
> 
> arr[4899].
> 
> 
> 
> <snip>
> 
> -- 
> 
> Ben.

Thanks Ben, i suspect it is a similar issue with arr[nunber]

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web