form variable not being set

i've written some javascript code that i believe should set a form
variable to a certain value, depending on what the user clicks on.
unfortunately, it isn't working. here's the url:

http://www.frostjedi.com/terra/scripts/graemlin3.html

clicking in the color palette thing and then clicking the submit button
reveals that the form variable named color isn't being set. if you
look at the javascript source, you'll see that i'm atleast attempting
to set it with "document.forms[0].color.value = 'xxxxxx'"...

any ideas on what i'm doing wrong and how i could go about fixing it
would be appreciated - thanks!

A job for 'alert', I'd say.

"yawnmoth" <terra1024@yahoo.com> wrote in message
news:1108506546.841534.205750@l41g2000cwc.googlegr oups.com...[color=blue]
> i've written some javascript code that i believe should set a form
> variable to a certain value, depending on what the user clicks on.
> unfortunately, it isn't working. here's the url:
>
> http://www.frostjedi.com/terra/scripts/graemlin3.html
>
> clicking in the color palette thing and then clicking the submit button
> reveals that the form variable named color isn't being set. if you
> look at the javascript source, you'll see that i'm atleast attempting
> to set it with "document.forms[0].color.value = 'xxxxxx'"...
>
> any ideas on what i'm doing wrong and how i could go about fixing it
> would be appreciated - thanks![/color]

In article <1108506546.841534.205750@l41g2000cwc.googlegroups .com>,
"yawnmoth" <terra1024@yahoo.com> wrote:
[color=blue]
> clicking in the color palette thing and then clicking the submit button
> reveals that the form variable named color isn't being set. if you
> look at the javascript source, you'll see that i'm atleast attempting
> to set it with "document.forms[0].color.value = 'xxxxxx'"...[/color]

Trim this down to just the color pane and the javascript.

Implement you own debug console so you can print out progress data.
see:
http://groups-beta.google.com/group/...t/msg/170ddb0d...

Here is an example of how to work with an input field.

Robert

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Simple validate</title>

<script type="text/javascript">

function myfunction(formName,formField)
{

var ok;
var newValue = document.forms[formName].elements[formField].value;
alert('formName = ' + formName +
' formField = ' + formField +
' value = ' + newValue);

if( /^(0|[1-9]\d*)$/.test(newValue) )
{
var theValue = parseInt(newValue,10) + 1;
document.forms[formName].elements[formField].value = theValue;
ok = true;
}
else
{ ok = false;
alert('You need to enter a number.')
}

return ok;
}
</script>
</head>
<body>
<p>
The HTML file demonstrates how increment an input field.
Please input a number. </p>
<p>
</p>
<form name="myForm"
action="http://www.natAValidWebAddress.com"
method="POST"
onsubmit="return myfunction('myForm','theAddress');">

<p>Address: 
<input type="text" name="theAddress" id='theAddress' size="40"></p>
<br>
<input type="submit" value="Submit address information">
</form>
</body>
</html>

yawnmoth wrote:[color=blue]
> i've written some javascript code that i believe should set a form
> variable to a certain value, depending on what the user clicks on.
> unfortunately, it isn't working. here's the url:
>
> http://www.frostjedi.com/terra/scripts/graemlin3.html
>
> clicking in the color palette thing and then clicking the submit[/color]
button[color=blue]
> reveals that the form variable named color isn't being set. if you
> look at the javascript source, you'll see that i'm atleast attempting
> to set it with "document.forms[0].color.value = 'xxxxxx'"...
>
> any ideas on what i'm doing wrong and how i could go about fixing it
> would be appreciated - thanks![/color]

Simple problem...the color values being generated by the 'colorSwatch'
function don't match the select values in the 'color' listbox. So
nothing gets selected. Probably the most logical way to proceed here is
to reconstruct the listbox at the same time you're 'replacing' it with
the palette, ensuring the values match. Roughly....

function colorSwatch(width, height)
{
............
............
document.getElementById('color').style.display = 'none';
extra = '';
var sel = document.forms[0].color; //get listbox
sel.options.length = 0; //clear it
............
............
for(b = 0; b < 5; b++) {
temp = "" + numberList[r] + "" + numberList[g] + "" + numberList[b];
sel.options[sel.options.length] = new Option(temp, temp);
document.writeln('<a href="javascript:void........
............
............
}

Cute little app. \:=)

RobB wrote:
[...][color=blue]
> var sel = document.forms[0].color; //get listbox
> sel.options.length = 0; //clear it[/color]

AFAIK, this will only work in IE because length is supposed to
be read-only. Surely the options should be removed using DOM
to remove the nodes, then add the new ones?

[...]

--
Rob

RobB wrote:[color=blue]
> yawnmoth wrote:
> <snip>
>
> Simple problem...the color values being generated by the[/color]
'colorSwatch'[color=blue]
> function don't match the select values in the 'color' listbox. So
> nothing gets selected. Probably the most logical way to proceed here[/color]
is[color=blue]
> to reconstruct the listbox at the same time you're 'replacing' it[/color]
with[color=blue]
> the palette, ensuring the values match. Roughly....[/color]
[color=blue]
> <snip code>[/color]

that makes sense. thanks for the tip / code! :)

as per RobG's comment... i found a website that i should be able to
reference for making it more cross-browser compliant (i'm mostly just
posting it for my personal reference):

http://www.mredkj.com/tutorials/tutorial005.html
[color=blue]
> Cute little app. \:=)[/color]

thanks! :=)

yawnmoth wrote:[color=blue]
> RobB wrote:[color=green]
> > yawnmoth wrote:
> > <snip>
> >
> > Simple problem...the color values being generated by the[/color]
> 'colorSwatch'[color=green]
> > function don't match the select values in the 'color' listbox. So
> > nothing gets selected. Probably the most logical way to proceed[/color][/color]
here[color=blue]
> is[color=green]
> > to reconstruct the listbox at the same time you're 'replacing' it[/color]
> with[color=green]
> > the palette, ensuring the values match. Roughly....[/color]
>[color=green]
> > <snip code>[/color]
>
> that makes sense. thanks for the tip / code! :)[/color]

Your'e welcome.
[color=blue]
> as per RobG's comment...[/color]

Don't sweat it.

http://www.faqts.com/knowledge_base/...d/1600/fid/178
[color=blue][color=green]
> > Cute little app. \:=)[/color]
>
> thanks! :=)[/color]

NP.

RobB wrote:
[...][color=blue][color=green]
>>as per RobG's comment...[/color]
>
> Don't sweat it.
>
> http://www.faqts.com/knowledge_base/...d/1600/fid/178[/color]

Since select.length is the same as select.options.length, why not
use:

select.length = 0;

Saves an entire 8 keystrokes. You can also use it to add options:

selectRef.length += 10;

will add 10 empty options.

Seems my understanding re length being read only is out of date
(in regard to arrays and collections anyway). Since about
JavaScript 1.1:

"You can set the length property to truncate an array at
any time. When you extend an array by changing its length
property, the number of actual elements does not increase..."

<URL:http://synchro.net/docs/js/ref/array.html#1193439>

Sun had some similar comments on options collections.

I could not find any reference on the W3C site to say that the
number of options can be modified by changing the length other
than this in their "issues to be resolved":

"From O'Reilly's JavaScript Definitive Guide book [p. 646]:

"[begin quote]

"If you set an element in the options[] array to null, then
that option will be removed from the Select object, and the
elements above it in the array will be moved down, changing
their indices, to occupy the new space in the array.

"If you create a new Option object with the Option()
constructor (see the Option reference entry), you can add that
option to the end of list of options in the Select object by
assigning the newly created option to a position at the end of
the options[] array. To do this, set options[options.length].

"[end quote]

"Additionally, if you set options.length to a value higher than
the current value, then the number of options in the Select
object will be increased by adding new options to the end of
the array.

"Each of the browsers that I tested, Netscape, Win IE, Mac IE,
and WebTV, all work as above. I tested older versions of
browsers as well as the latest versions of these browsers."

<URL:http://www.w3.org/2001/12/DOM-Level-2-issues#i9b>

So I guess use length to modify arrays/collections all you like,
you should be able to extend and truncate arrays this way and can
use select.length or select.options.length (tested in IE and
Firefox).

--
Rob

RobG wrote:

[snip]
[color=blue]
> I could not find any reference on the W3C site to say that the
> number of options can be modified by changing the length other
> than this in their "issues to be resolved":[/color]

So I take it you didn't read the DOM 2 HTML Specification
(<URL:http://www.w3.org/TR/DOM-Level-2-HTML>) then? :P

From Appendix D - ECMAScript Language Binding:

Objects that implement the HTMLOptionsCollection interface:
Properties of objects that implement the HTMLOptionsCollection
interface:
length
This property is a Number and can raise an object that
implements DOMException interface on setting.

[Note that it doesn't say "read-only" in the description.]

Objects that implement the HTMLSelectElement interface:
Properties of objects that implement the HTMLSelectElement
interface:
length
This property is a Number and can raise an object that
implements DOMException interface on setting.

[Again, no "read-only".]

From Appendix A.1.1 - Changes to DOM Level 1 interfaces and exceptions:

Interface HTMLSelectElement
The type of the attribute options was changed from HTMLCollection
to HTMLOptionsCollection.
The attribute length is no longer readonly and is now unsigned.

[The length property of the HTMLCollection interface in both versions
/is/ read-only, so the change is significant.]

[snip]

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

Michael Winter wrote:[color=blue]
> RobG wrote:
>
> [snip]
>[color=green]
>> I could not find any reference on the W3C site to say that the
>> number of options can be modified by changing the length other
>> than this in their "issues to be resolved":[/color]
>
>
> So I take it you didn't read the DOM 2 HTML Specification
> (<URL:http://www.w3.org/TR/DOM-Level-2-HTML>) then? :P[/color]

Not, strictly speaking, in its entirety. But the point is kinda
moot since I'm not sure that had I done so I would have inferred
that I could use length to add and delete elements from an
options collection anyway. :-(

[...][color=blue]
>
> [Note that it doesn't say "read-only" in the description.][/color]
[...][color=blue]
> [Again, no "read-only".]
>[/color]

But it does say the length attribute of HTMLCollection is
read-only. To me, it would be handy if at that point the spec
pointed out that there are exceptions to the rule.

Noted of course that for HTMLOptionsCollection, length
"specifies the length or size of the list."

I can't find anywhere in the spec that says something like
"length can be used to change the number of elements in an
options collection".

Clearly I don't think laterally enough! ;-)

--
Rob

RobG wrote:

[DOM 2 HTML Specification]
[color=blue]
> But it does say the length attribute of HTMLCollection is
> read-only.[/color]

Yes, that hasn't changed. That property is read-only in both DOM 1 and 2.
[color=blue]
> To me, it would be handy if at that point the spec
> pointed out that there are exceptions to the rule.[/color]

But there aren't any exceptions. In DOM 1, the HTMLSelectElement
interface used HTMLCollection for the options collection. Therefore,
under DOM 1, you couldn't modify the property. Once the working group
realised that DOM 0 allowed hosts to treat the options collection like
an array (in that changing the length property modified the array),
they introduced a new interface: HTMLOptionsCollection. It is exactly
the same as the HTMLCollection interface except that the length
property is read/write. The other change was that the
HTMLSelectElement interface itself was modified to make the length
property there read/write, too.

If you look at the respective interfaces, the specification marks
changes with the text "Modified in DOM Level 2" and "introduced in DOM
Level 2". The specific details are listed in Appendix A.

Finally, note that implementations are allowed to raise an exception
if the length attributes are modified, presumably to allow easier
migration from DOM 1 to DOM 2.

[snip]

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

form variable not being set

re: form variable not being set

re: form variable not being set

re: form variable not being set

re: form variable not being set

re: form variable not being set

re: form variable not being set

re: form variable not being set

re: form variable not being set

re: form variable not being set

re: form variable not being set

Similar JavaScript / Ajax / DHTML bytes

/bytes/development

/bytes/it

/bytes/about