onchange() doesn't seem to work

[Mattias Campe]

Hello,

On http://student.ugent.be/astrid/bewoners.php I got the problem that I
want Javascript to let my browser go to
http://student.ugent.be/astrid/bewon...ginAcjaar=2002 when I
select 2002-03 in the form in the upper right corner (idem dito for the
other years).

My form is composed by:
<form method="post" action="bewoner s.php">
<select onchange="veran derAcjaar()" name="selecteer Acjaar">
<option>2001-02</option>
<option>2002-03</option>
<option>2003-04</option>
</select>
</form>

and my Javascript code (that I've placed in <head/>):
<script language="Javas cript" type="text/javascript">
function veranderAcjaar( ) {
var acjaar =
selecteerAcjaar .options[selecteerAcjaar .selectedIndex].value
location =
"http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" + acjaar
}
</script>


What could be wrong with this code? It /seems/ right to me, but
apparently it isn't. The browser doesn't even seem to execute the
function :-s (hmm, my knowledge of Javascript doesn't seem that good :-/)



Any help would be appreciated,
greetings,
Mattias

[Lasse Reichstein Nielsen]

Re: onchange() doesn't seem to work

Mattias Campe <Mattias.NoSpam Plzz.Campe@UGen t.be> writes:
[color=blue]
> On http://student.ugent.be/astrid/bewoners.php I got the problem that
> I want Javascript to let my browser go to
> http://student.ugent.be/astrid/bewon...ginAcjaar=2002 when I
> select 2002-03 in the form in the upper right corner (idem dito for
> the other years).[/color]

I see two problems.
[color=blue]
> My form is composed by:
> <form method="post" action="bewoner s.php">
> <select onchange="veran derAcjaar()" name="selecteer Acjaar">
> <option>2001-02</option>[/color]
....[color=blue]
> and my Javascript code (that I've placed in <head/>):
> <script language="Javas cript" type="text/javascript">
> function veranderAcjaar( ) {
> var acjaar =
> selecteerAcjaar .options[selecteerAcjaar .selectedIndex].value[/color]

Problem one: You haven't declared the variable "selecteerAcjaa r".
Some browsers (most notably IE) automatically declare global variables
with the same name as named elements on the page. Other browsers
don't. Change this to
var selRef = document.forms[0].elements['selecteerAcjaa r'];
var acjaar = selRef.options[selRef.selected Index].text;
(or, preferably, pass the selRef as an argument to the function as
onchange="veran derAcjaar(this) ;" )

Problem two: notice the ".text" at the end instead of ".value". The
content of an option is the "text" property, not the "value"
property. The value is specified as
<option value="Value">t ext</option>

[color=blue]
> location =
> "http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" +
> acjaar[/color]

I prefer
location.href = ...
And remember the semicolon at the end.
[color=blue]
> What could be wrong with this code? It /seems/ right to me, but
> apparently it isn't. The browser doesn't even seem to execute the
> function :-s (hmm, my knowledge of Javascript doesn't seem that good
> :-/)[/color]

Nor your knowledge of how to make browsers show error messages:
<URL:http://jibbering.com/faq/#FAQ4_43>

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleD OM.html>
'Faith without judgement merely degrades the spirit divine.'

[Mattias Campe]

Re: onchange() doesn't seem to work

Lasse Reichstein Nielsen wrote:[color=blue]
> Mattias Campe <Mattias.NoSpam Plzz.Campe@UGen t.be> writes:[color=green]
>>On http://student.ugent.be/astrid/bewoners.php I got the problem that
>>I want Javascript to let my browser go to
>>http://student.ugent.be/astrid/bewon...ginAcjaar=2002 when I
>>select 2002-03 in the form in the upper right corner (idem dito for
>>the other years).[/color]
>
>
> I see two problems.
>
>[color=green]
>>My form is composed by:
>><form method="post" action="bewoner s.php">
>> <select onchange="veran derAcjaar()" name="selecteer Acjaar">
>> <option>2001-02</option>[/color]
>
> ...
>[color=green]
>>and my Javascript code (that I've placed in <head/>):
>><script language="Javas cript" type="text/javascript">
>> function veranderAcjaar( ) {
>> var acjaar =
>> selecteerAcjaar .options[selecteerAcjaar .selectedIndex].value[/color]
>
>
> Problem one: You haven't declared the variable "selecteerAcjaa r".
> Some browsers (most notably IE) automatically declare global variables
> with the same name as named elements on the page. Other browsers
> don't.[/color]

Thanks for pointing me on this one, I also like my code most when it
doesn't have to presume anything about the used browser...
[color=blue]
> Change this to
> var selRef = document.forms[0].elements['selecteerAcjaa r'];
> var acjaar = selRef.options[selRef.selected Index].text;
> (or, preferably, pass the selRef as an argument to the function as
> onchange="veran derAcjaar(this) ;" )[/color]

Do you mean that I could just use the following with veranderAcjaar( this):
var acjaar = this.options[selRef.selected Index].text;
?
[color=blue]
> Problem two: notice the ".text" at the end instead of ".value". The
> content of an option is the "text" property, not the "value"
> property. The value is specified as
> <option value="Value">t ext</option>[/color]

ic
[color=blue][color=green]
>> location =
>> "http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" +
>> acjaar[/color]
>
>
> I prefer
> location.href = ...[/color]

done
[color=blue]
> And remember the semicolon at the end.[/color]

Indeed, forgot about it :-s
[color=blue][color=green]
>>What could be wrong with this code? It /seems/ right to me, but
>>apparently it isn't. The browser doesn't even seem to execute the
>>function :-s (hmm, my knowledge of Javascript doesn't seem that good
>>:-/)[/color]
>
>
> Nor your knowledge of how to make browsers show error messages:
> <URL:http://jibbering.com/faq/#FAQ4_43>[/color]

Wauw, thanks for all the help, that link is bookmarked :)! But,
unfortunately, it still doesn't work. When I use the Javascript console
from Firefox, it tells me:
Error: selRef has no properties
Source file: http://student.ugent.be/astrid/bewoners.php Line:25

I checked the faq you gave me and http://jibbering.com/faq/#FAQ4_13 uses
quiet the same syntax that you gave me, so I don't see a problem there.
I hope you could help me again a little bit further :).

For the completeness, here's the new code:
<script language="Javas cript" type="text/javascript">
function veranderAcjaar( ) {
var selRef = document.forms[0].elements['selecteerAcjaa r'];
var acjaar = selRef.options[selRef.selected Index].text;
location.href =
"http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" + acjaar;
}
</script>

and:
<form method="post" action="bewoner s.php">
<select onchange="veran derAcjaar()" name="selecteer Acjaar">
<option>2001-02</option>
<option>2002-03</option>
<option>2003-04</option>
</select>
</form>

Greetings,
Mattias

[Lasse Reichstein Nielsen]

Re: onchange() doesn't seem to work

Mattias Campe <Mattias.NoSpam Plzz.Campe@UGen t.be> writes:
[color=blue]
> For the completeness, here's the new code:
> <script language="Javas cript" type="text/javascript">
> function veranderAcjaar( ) {
> var selRef = document.forms[0].elements['selecteerAcjaa r'];
> var acjaar = selRef.options[selRef.selected Index].text;
> location.href =
> "http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" + acjaar;
> }
> </script>
>
> and:
> <form method="post" action="bewoner s.php">
> <select onchange="veran derAcjaar()" name="selecteer Acjaar">
> <option>2001-02</option>
> <option>2002-03</option>
> <option>2003-04</option>
> </select>
> </form>[/color]

This code works for me in Opera. Ofcourse it assumes that the relevant
form is the first form on the page (forms[0]). If it isn't, it will fail.
That is why I recommended passing the select as an argument:
---
<script type="text/javascript">
function veranderAcjaar( selRef) {
var acjaar = selRef.options[selRef.selected Index].text;
location.href =
"http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" + acjaar;
}
</script>
---
and:
---
<form method="post" action="bewoner s.php">
<select onchange="veran derAcjaar(this) ;" name="selecteer Acjaar">
<option>2001-02</option>
<option>2002-03</option>
<option>2003-04</option>
</select>
</form>
---
(Why the form, btw? You don't use it, since there is no way to submit
it. You can omit the form element entirely when you address the select
directly like this, unless you need the page to work in Netscape 4 too :)

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleD OM.html>
'Faith without judgement merely degrades the spirit divine.'

[Morris]

Re: onchange() doesn't seem to work


"Mattias Campe" <Mattias.NoSpam Plzz.Campe@UGen t.be> a écrit dans le message
de news:c5hcec$d0d $1@gaudi2.UGent .be...[color=blue]
> Lasse Reichstein Nielsen wrote:[color=green]
> > Mattias Campe <Mattias.NoSpam Plzz.Campe@UGen t.be> writes:[color=darkred]
> >>On http://student.ugent.be/astrid/bewoners.php I got the problem that
> >>I want Javascript to let my browser go to
> >>http://student.ugent.be/astrid/bewon...ginAcjaar=2002 when I
> >>select 2002-03 in the form in the upper right corner (idem dito for
> >>the other years).[/color]
> >
> >
> > I see two problems.
> >
> >[color=darkred]
> >>My form is composed by:
> >><form method="post" action="bewoner s.php">
> >> <select onchange="veran derAcjaar()" name="selecteer Acjaar">
> >> <option>2001-02</option>[/color]
> >
> > ...
> >[color=darkred]
> >>and my Javascript code (that I've placed in <head/>):
> >><script language="Javas cript" type="text/javascript">
> >> function veranderAcjaar( ) {
> >> var acjaar =
> >> selecteerAcjaar .options[selecteerAcjaar .selectedIndex].value[/color]
> >
> >
> > Problem one: You haven't declared the variable "selecteerAcjaa r".
> > Some browsers (most notably IE) automatically declare global variables
> > with the same name as named elements on the page. Other browsers
> > don't.[/color]
>
> Thanks for pointing me on this one, I also like my code most when it
> doesn't have to presume anything about the used browser...
>[color=green]
> > Change this to
> > var selRef = document.forms[0].elements['selecteerAcjaa r'];
> > var acjaar = selRef.options[selRef.selected Index].text;
> > (or, preferably, pass the selRef as an argument to the function as
> > onchange="veran derAcjaar(this) ;" )[/color]
>
> Do you mean that I could just use the following with veranderAcjaar( this):
> var acjaar = this.options[selRef.selected Index].text;
> ?
>[color=green]
> > Problem two: notice the ".text" at the end instead of ".value". The
> > content of an option is the "text" property, not the "value"
> > property. The value is specified as
> > <option value="Value">t ext</option>[/color]
>
> ic
>[color=green][color=darkred]
> >> location =
> >> "http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" +
> >> acjaar[/color]
> >
> >
> > I prefer
> > location.href = ...[/color]
>
> done
>[color=green]
> > And remember the semicolon at the end.[/color]
>
> Indeed, forgot about it :-s
>[color=green][color=darkred]
> >>What could be wrong with this code? It /seems/ right to me, but
> >>apparently it isn't. The browser doesn't even seem to execute the
> >>function :-s (hmm, my knowledge of Javascript doesn't seem that good
> >>:-/)[/color]
> >
> >
> > Nor your knowledge of how to make browsers show error messages:
> > <URL:http://jibbering.com/faq/#FAQ4_43>[/color]
>
> Wauw, thanks for all the help, that link is bookmarked :)! But,
> unfortunately, it still doesn't work. When I use the Javascript console
> from Firefox, it tells me:
> Error: selRef has no properties
> Source file: http://student.ugent.be/astrid/bewoners.php Line:25
>
> I checked the faq you gave me and http://jibbering.com/faq/#FAQ4_13 uses
> quiet the same syntax that you gave me, so I don't see a problem there.
> I hope you could help me again a little bit further :).
>
> For the completeness, here's the new code:
> <script language="Javas cript" type="text/javascript">
> function veranderAcjaar( ) {
> var selRef = document.forms[0].elements['selecteerAcjaa r'];
> var acjaar = selRef.options[selRef.selected Index].text;[/color]

change the above line to:
var acjaar = selRef.options[selRef.selected Index].value;
[color=blue]
> location.href =
> "http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" + acjaar;
> }
> </script>
>
> and:
> <form method="post" action="bewoner s.php">
> <select onchange="veran derAcjaar()" name="selecteer Acjaar">
> <option>2001-02</option>
> <option>2002-03</option>
> <option>2003-04</option>[/color]

and these to:

<option value=2001>2001-02</option>
<option value=2002>2002-03</option>
<option value=2003>2003-04</option>
[color=blue]
> </select>
> </form>
>
> Greetings,
> Mattias[/color]

[Mattias Campe]

Re: onchange() doesn't seem to work

Lasse Reichstein Nielsen wrote:
[...][color=blue]
> This code works for me in Opera. Ofcourse it assumes that the relevant
> form is the first form on the page (forms[0]). If it isn't, it will fail.
> That is why I recommended passing the select as an argument:
> ---
> <script type="text/javascript">
> function veranderAcjaar( selRef) {
> var acjaar = selRef.options[selRef.selected Index].text;
> location.href =
> "http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" + acjaar;
> }
> </script>
> ---
> and:
> ---
> <form method="post" action="bewoner s.php">
> <select onchange="veran derAcjaar(this) ;" name="selecteer Acjaar">
> <option>2001-02</option>
> <option>2002-03</option>
> <option>2003-04</option>
> </select>
> </form>[/color]

I uses (this) and I also used the remark by Morris, because
?beginAcjaar="2 001-02" will not work, it has to be ?beginacjaar="2 001"
(stupid me :-/ ;) )
[color=blue]
> (Why the form, btw? You don't use it, since there is no way to submit
> it. You can omit the form element entirely when you address the select
> directly like this, unless you need the page to work in Netscape 4 too :)[/color]

Well, I thought that a <select> had to be surrounded by <form>, but as
this doesn't seem to be true, I just omitted it.


Really, thanks a lot for the help!
Greetings,
Mattias

[Mattias Campe]

Re: onchange() doesn't seem to work

Morris wrote:[color=blue]
> "Mattias Campe" <Mattias.NoSpam Plzz.Campe@UGen t.be> a écrit dans le message[/color]
[color=blue]
> change the above line to:
> var acjaar = selRef.options[selRef.selected Index].value;
>
>[color=green]
>> location.href =
>>"http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" + acjaar;
>> }
>></script>
>>
>>and:
>><form method="post" action="bewoner s.php">
>> <select onchange="veran derAcjaar()" name="selecteer Acjaar">
>> <option>2001-02</option>
>> <option>2002-03</option>
>> <option>2003-04</option>[/color]
>
>
> and these to:
>
> <option value=2001>2001-02</option>
> <option value=2002>2002-03</option>
> <option value=2003>2003-04</option>[/color]

Of course! How could I overlook that :-/


Really, thanks a lot for the help!
It works now: http://student.ugent.be/astrid/bewoners.php
Greetings,
Mattias

[G Roydor]

Re: onchange() doesn't seem to work

Donner un nom à votre formulaire (<form name="myform" ....>)
et var acjaar=myform.s elect..........
GR

Mattias Campe a écrit:[color=blue]
> Hello,
>
> On http://student.ugent.be/astrid/bewoners.php I got the problem that I
> want Javascript to let my browser go to
> http://student.ugent.be/astrid/bewon...ginAcjaar=2002 when I
> select 2002-03 in the form in the upper right corner (idem dito for the
> other years).
>
> My form is composed by:
> <form method="post" action="bewoner s.php">
> <select onchange="veran derAcjaar()" name="selecteer Acjaar">
> <option>2001-02</option>
> <option>2002-03</option>
> <option>2003-04</option>
> </select>
> </form>
>
> and my Javascript code (that I've placed in <head/>):
> <script language="Javas cript" type="text/javascript">
> function veranderAcjaar( ) {
> var acjaar =
> selecteerAcjaar .options[selecteerAcjaar .selectedIndex].value
> location =
> "http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" + acjaar
> }
> </script>
>
>
> What could be wrong with this code? It /seems/ right to me, but
> apparently it isn't. The browser doesn't even seem to execute the
> function :-s (hmm, my knowledge of Javascript doesn't seem that good :-/)
>
>
>
> Any help would be appreciated,
> greetings,
> Mattias[/color]

[Mattias Campe]

Re: onchange() doesn't seem to work

G Roydor wrote:[color=blue]
> Donner un nom à votre formulaire (<form name="myform" ....>)
> et var acjaar=myform.s elect..........[/color]

Merci beaucoup, mais j'ai déja une solution :)...
[color=blue]
> GR
>
> Mattias Campe a écrit:
>[color=green]
>> Hello,
>>
>> On http://student.ugent.be/astrid/bewoners.php I got the problem that
>> I want Javascript to let my browser go to
>> http://student.ugent.be/astrid/bewon...ginAcjaar=2002 when I
>> select 2002-03 in the form in the upper right corner (idem dito for
>> the other years).
>>
>> My form is composed by:
>> <form method="post" action="bewoner s.php">
>> <select onchange="veran derAcjaar()" name="selecteer Acjaar">
>> <option>2001-02</option>
>> <option>2002-03</option>
>> <option>2003-04</option>
>> </select>
>> </form>
>>
>> and my Javascript code (that I've placed in <head/>):
>> <script language="Javas cript" type="text/javascript">
>> function veranderAcjaar( ) {
>> var acjaar =
>> selecteerAcjaar .options[selecteerAcjaar .selectedIndex].value
>> location =
>> "http://student.ugent.b e/astrid/bewoners.php?be ginAcjaar=" + acjaar
>> }
>> </script>
>>
>>
>> What could be wrong with this code? It /seems/ right to me, but
>> apparently it isn't. The browser doesn't even seem to execute the
>> function :-s (hmm, my knowledge of Javascript doesn't seem that good :-/)
>>
>>
>>
>> Any help would be appreciated,
>> greetings,
>> Mattias[/color]
>
>[/color]