Having trouble with the SelectSeat function, it doesn't seem to be working even though I've called it from the HTML onclick event.
<html>
<head><link rel="stylesheet" type="text/css" href="mandigo.css">
<center> <b><i><font size="25" color="Blue"> Ticket Booking </b></i> </font>
<script>
var seat = [true,false,true,false,false,false];
var sel_seat=-1;//for selecting a seat
function setHtml(){
alert("check");
for(var i=0;i<seat.length ;i++){
if(seat[i]){
document.getElementById("seat"+(i+1)).src ="Avail.png";
document.getElementById("seat"+(i+1)).alt ="Available";
}
else{
document.getElementById("seat"+(i+1)).src ="UnAvail.png";
document.getElementById("seat"+(i+1)).alt ="UnAvailable";
}
}
}
function SelectSeat(){
setHtml();
for(var i=0;i<seat.length;i++){
if(seat[i]){
sel_seat=i+1;
var accept=confirm("Seat "+(i+1)+" is Available. Book it ??");
if(accept){
Booking();// in Booking change the seat color using anothr picture.
break;//to break out of the loop
}
//if not true loop continues until it fins an empty seat
/*if(!accept){
}*/
if(sel_seat==-1&&i>=seat.length+1)
alert("No Seats Are Available");
}
}
}
function Booking(){
document.getElementById("seat"+sel_seat).src="SelectedSeat.png";
}
</script>
</head>
<body>
<div><pre>
<img src="Avail.png" alt="Available" id="seat1"width="90" height="90"><img src="Avail.png" alt="Available" id="seat2"width="90" height="90">
<img src="Avail.png" alt="Available" id="seat4"width="90" height="90"><img src="Avail.png" alt="Available" id="seat5"width="90" height="90">
<img src="Avail.png" alt="Available" id="seat3"width="90" height="90"><img src="Avail.png" alt="Available" id="seat6"width="90" height="90">
</pre></div>
<center>
<input type="Button" value="Find Me a Seat" onClick="SelectSeat();"/>
</body>
</html>
Apologies for not providing the full program initially. When I say it's not working, I mean that nothing happens and there are no error messages displayed either.