Member Avatar for no183

Hi all, as titled i need to create a cinema ticketing system which i am very headache to it. Here are some problem i faced, actually i need to create a very complex one as the webpage
1) Need to able to select the number of ticket required before enter to the seat selecting page (so that it can select number of seat based on the number of ticket enter - i only managed to do 1 ticket at the time.
2) After selecting the ticket and press the "book" button, it will come to a page where it show the seat status (blue for booked, red for unbooked) instead of this, i want the seat number to be shown as well in this page, any idea?
3) Besides, u can see that the date is only for today, how bout if i want to make it for multiple date?

I alraedy attached the html. Hope u guys can help me, thanks :)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
  .book {background-color:blue; text-align:center}
  .unbook {background-color:red; text-align:center}
  .book2 {background-color:blue; color:blue}
  .unbook2 {background-color:red; color:red}
  body {
	background-color: #999;
}
</style>
</head>

<script type="text/javascript">
<!--
   //create 8 column
   seats = new Array(8);
   
function initArray(seat) {
	for (var row=0; row<seat.length; row++) {  //initialise the row
		seat[row] = new Array(8);
    }
	for (var row =0; row<seat.length; row++) {
        for (var col=0; col<seat[row].length; col++) {
			seat[row][col] = "Available";
		}	
	}       
}

 
function showSeats() {
	var elem = document.getElementById("map");
	var output="";
    
	output += "<table border='1'>\n";
	output += "<tbody>\n";

	for (var row =0; row<seats.length; row++) {
		output += "<tr>\n";
		for (var col=0; col<seats[row].length; col++){
			if (seats[row][col]=="Available")
			output += "<td class=\"unbook2\">"+seats[row][col]+ "</td>\n";
                else
		    output += "<td class=\"book2\">"+seats[row][col]+ "</td>\n";
		}	
    output += "</tr>";
	}	
	
	output += "</tbody>\n";
	output += "</table>\n";

	//alert(output);
	elem.innerHTML = output;
}
	 
	 
function book() {
	var row = document.getElementById("row").selectedIndex;
	var col = document.getElementById("col").selectedIndex;
	var r = document.getElementById("row").options;
	var c = document.getElementById("col").options;

	if (seats[row][col]=="Available") {
        seats[row][col] = "Booked";
	    alert("Seat successfully booked");
	    showSeats();
	}
    else {
		alert("The seat was booked by somebody else!");
	}          
}


	initArray(seats);

//-->
</script>

</head><body>
                <p><img src="cinemaLogo.jpg" alt="cinemaLogo" width="749" height="356" /></p>
             
<p>Booking </p>
<p>Date : 
  
  <select name="col" size="1" id="col2">
    <option>Today</option>
  </select>
</p>
<table width="943" height="1174" border="1">
  <tr>
    <th width="326" height="42" scope="col">Movies</th>
    <th width="601" scope="col">Time</th>
  </tr>
  <tr>
    <th scope="row"><img src="spiderman.jpg" width="270" height="370" alt="spiderman" /></th>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <th scope="row"><img src="brave.jpg" width="250" height="370" alt="brave" /></th>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <th scope="row"><img src="vampire.jpg" width="250" height="368" alt="vampire" /></th>
    <td>&nbsp;</td>
  </tr>
</table>
<p>&nbsp;</p>
<p><br>
  
</p>
<form id="booking">
  <label>
      Row 
	<select id="row">
	  <option value="1" selected="">A</option>
	  <option value="2">B</option>
	  <option value="3">C</option>
	  <option value="4">D</option>
	  <option value="5">E</option>
      <option value="6">F</option>
      <option value="7">G</option>
      <option value="8">H</option>
	</select>
  </label>


  <label>
      Column 
	<select id="col">
	  <option value="1" selected="">1</option>
	  <option value="2">2</option>
	  <option value="3">3</option>
	  <option value="4">4</option>
	  <option value="5">5</option>
	  <option value="6">6</option>
	  <option value="7">7</option>
	  <option value="8">8</option>
	</select>
  </label>
  
  <div><input type="button" onclick="book()" value="Book"></div>
</form>



<hr>
<div id="map">
  <table width="487" height="39" border="1" align="center">
    <tr>
      <th width="333" height="33" scope="col">SCREEN</th>
    </tr>
  </table>
  <table width="487" border="1" align="center">
  <tbody>
<tr>
<th width="8" class="unblock">A</th>
<td width="8" class="unbook">A1</td>
<td width="8" class="unbook">A2</td>
<td width="8" class="unbook">A3</td>
<td width="8" class="unbook">A4</td>
<td width="8" class="unbook">A5</td>
<td width="8" class="unbook">A6</td>
<td width="8" class="unbook">A7</td>
<td width="8" class="unbook">A8</td>

</tr><tr>
<th width="8" class="unblock">B</th>
<td width="8" class="unbook">B1</td>
<td width="8" class="unbook">B2</td>
<td width="8" class="unbook">B3</td>
<td width="8" class="unbook">B4</td>
<td width="8" class="unbook">B5</td>
<td width="8" class="unbook">B6</td>
<td width="8" class="unbook">B7</td>
<td width="8" class="unbook">B8</td>
</tr><tr>
<th width="8" class="unblock">C</th>
<td width="8" class="unbook">C1</td>
<td width="8" class="unbook">C2</td>
<td width="8" class="unbook">C3</td>
<td width="8" class="unbook">C4</td>
<td width="8" class="unbook">C5</td>
<td width="8" class="unbook">C6</td>
<td width="8" class="unbook">C7</td>
<td width="8" class="unbook">C8</td>
</tr><tr>
<th width="8" class="unblock">D</th>
<td width="8" class="unbook">D1</td>
<td width="8" class="unbook">D2</td>
<td width="8" class="unbook">D3</td>
<td width="8" class="unbook">D4</td>
<td width="8" class="unbook">D5</td>
<td width="8" class="unbook">D6</td>
<td width="8" class="unbook">D7</td>
<td width="8" class="unbook">D8</td>
</tr><tr>
<th width="8" class="unblock">E</th>
<td width="8" class="unbook">E1</td>
<td width="8" class="unbook">E2</td>
<td width="8" class="unbook">E3</td>
<td width="8" class="unbook">E4</td>
<td width="8" class="unbook">E5</td>
<td width="8" class="unbook">E6</td>
<td width="8" class="unbook">E7</td>
<td width="8" class="unbook">E8</td>
</tr><tr>
<th width="8" class="unblock">F</th>
<td width="8" class="unbook">F1</td>
<td width="8" class="unbook">F2</td>
<td width="8" class="unbook">F3</td>
<td width="8" class="unbook">F4</td>
<td width="8" class="unbook">F5</td>
<td width="8" class="unbook">F6</td>
<td width="8" class="unbook">F7</td>
<td width="8" class="unbook">F8</td>
</tr><tr>
<th width="8" class="unblock">G</th>
<td width="8" class="unbook">G1</td>
<td width="8" class="unbook">G2</td>
<td width="8" class="unbook">G3</td>
<td width="8" class="unbook">G4</td>
<td width="8" class="unbook">G5</td>
<td width="8" class="unbook">G6</td>
<td width="8" class="unbook">G7</td>
<td width="8" class="unbook">G8</td>
</tr><tr>
</tr><tr>
<th width="8" class="unblock">H</th>
<td width="8" class="unbook">H1</td>
<td width="8" class="unbook">H2</td>
<td width="8" class="unbook">H3</td>
<td width="8" class="unbook">H4</td>
<td width="8" class="unbook">H5</td>
<td width="8" class="unbook">H6</td>
<td width="8" class="unbook">H7</td>
<td width="8" class="unbook">H8</td>
</tr></tbody>
</table>
  <table width="487" height="39" border="1" align="center">
    <tr>
      <th width="336" height="33" scope="col">ENTERANCE</th>
    </tr>
  </table>
</div>

<br>
<input name="Reset" type="reset" onclick="showSeats()" value="Show Seats" />
</html>
  • 3 Contributors
  • 6 Replies
  • 112 Views
  • 2 Days Discussion Span
  • Latest Post Latest Post by php_noob
Member Avatar for no183

Anyone? please

Member Avatar for php_noob

Do you need some help in designing? or in code? Its really complex to discuss it here.
Maybe we could collaborate.... PM me!

Member Avatar for no183

i think designing is ok right because i can simply edit it in myself, the tough part is the javascript

Member Avatar for drjohn

this is a database problem.
how good are your mysql / php skills

Edited by drjohn
Member Avatar for no183

n00b , frankly speaking, i never did that before :(

Member Avatar for php_noob

I see.... but you see it's a process... it's not that simple as "here is I want to see" boom.... result. drjohn has a point.
there is a database involved. The HTML you attached is not that helping also. it's too plain to decide where you will be going. =)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.