Onchange to trace option selected and variable

[SauloM]

Hya!
The code underneath is giving me lots of problems but I can't figure out what might be wrong, as I am very new to JavaScript. I would be grateful if somebody could give me a hint on what I should do to fix it. By the way the code is incomplete. I have just posted the information that is needed for this calculation.

Let me explain what this code is supposed to do briefly. I have a music venue that has a maximum number of tickets set to 100. On my page I want to show the number of tickets available on a text box or any other way that would let this change dynamically. This number would change based on which option the user would select on the drop-down list but would start as 100.

I would like that the number of tickets available were then sent to my server together with the other information given in the form.

Up to now the number of tickets selected by the user is sent and also the name of the band but not the number of tickets available.

I would also like to block the okay button if there are no tickets available. That's why I've added an alert to the code but I don't think it's a good solution.

Alternatively the number of tickets available could be linked to a database, but I would say that's too advanced for me at the moment.

I am looking forward to hearing from you.

Yours,

Saulo

PS.: All my pages are in JSP.


<script language="javascript">
var ticketsTotal = 100;
function ticketsLeft() {/
/ var number = "undefined";
// var ticketsAv = "undefined";/
/ checking value selected from list box and applying a variable to it

if (document.seats.numberOfTickets[0].selected)
{number = 1;}
if (document.seats.numberOfTickets[1].selected)
{number = 2;}
if (document.seats.numberOfTickets[2].selected)
{number = 3;}
if (document.seats.numberOfTickets[3].selected)
{number = 4;}
if (document.seats.numberOfTickets[4].selected)
{number = 5;}
for (ticketsAv = 100; ticketsAv > 0)
{
ticketsAv = ticketsAv - number;
document.seats.displayTickLeft.value = ticketsAv;
}if (ticketsAv ==0)
{alert ("There are no more tickets available");}

// giving the number of tickets left
}return ticketsAv;
}
</script>
<form method="GET" action ="basket.jsp" name="seats" onSubmit="" onChange ="ticketsLeft()">

<p>Tickets left : <input type="text" name="displayTickLeft" onChange="ticketsLeft(ticketsAv)">
</p><p> <select name ="numberOfTickets"> <option selected value ="1">1</option> <option value ="2">2</option> <option value ="3">3</option> <option value ="4">4</option> <option value ="5">5</option> </select> <input type="submit" value="Go">
</p>
</form>

[joh6nn]

try this:

<script language="javascript">

var ticketsTotal = 100;
function ticketsLeft() {
var dSeats = document.seats;
var number = dSeats.numberOfTickets.selectedIndex + 1;
// Where is ticketsAV coming from? i didn't see it defined anywhere
ticketsAv -= number;

if (ticketsAv < 0) {
dSeats.go.disabled = true;
var isAre = (number += ticketsAv == 1) ? 'is ' : 'are ';
var ticks = (number == 1) ? 'ticket ' : 'tickets ';
"There" + isAre + "only " + ticks + "left";
}

// giving the number of tickets left
return ticketsAv; //You're returning this value, but i can't figure out why; you don't seem to do anything with it
}

</script>

<form method="GET" action ="basket.jsp" name="seats">
<p>Tickets left : <input type="text" name="displayTickLeft" onChange="ticketsLeft();"></p>
<p><select name="numberOfTickets">
<option selected value ="1">1</option>
<option value ="2">2</option>
<option value ="3">3</option>
<option value ="4">4</option>
<option value ="5">5</option>
</select>
<input name="go" type="submit" value="Go">
</p>
</form>

[SauloM]

Well, the variable ticketsAv should display on the page the number of tickets that are left for the concert. That's where I got completely confused. Thanks a lot for your help! I will be testing your code very soon.

Yours,

Saulo