а затем, что я не знаю как сделать так чтоб оно взяв место и ряд вставило именно на своё место картинку. У меня вот что-то в голове не складывается как подобрать условия чтоб всё получилось.
Если бы конечно вместо пустых мест к примеру стоят 0, то было бы проще, но опять же как отловить это в коллекции и вставить на нужные места 0, тоже не очень получается придумать=(

делаешь 2 цикла по рядам и по местам
при выводе ячейки проверяешь занята ли она, у тебя есть номер ряда и номер места для этого

Два цикла нужны для прорисовки всех ячеек, но нужен ещё цикл чтоб проходить по коллекции, а если его добавлять, то таблица будет вылазить за пределы картинки тк слишком много циклов.
И я хз какое условие вставить чтоб он поставило картинку, мол место занято.
Вот примерно как это всё должно выглядеть, но в итоге если такое запустить, то получится как на картинке ниже. Хотя последнее место в первом ряду должно находится на месте №7, а не №5

<TABLE>
	<tbody>
		<c:forEach var="r" begin="1" end="7">
			<TR>
				<c:forEach var="p" begin="1" end="10">
					<c:forEach var="places" items="${places}">
						<c:if test="${places.place==p and places.row==r}">
							<TD>${cancel}</TD>
						</c:if>
					</c:forEach>
				</c:forEach>
			</TR>	
		</c:forEach>
	</tbody>
</TABLE>

Вот почти правильный цикл, но он оно отрабатывает больше чем надо=( и поэтому всё получается криво=(

<TABLE>
	<tbody>
		<c:forEach var="r" begin="1" end="7">
			<TR>
				<c:forEach var="p" begin="1" end="10">
					<c:forEach var="places" items="${places}">
						<c:choose>
							<c:when test="${places.place==p and places.row==r}">
								<TD>${cancel}</TD>
							</c:when>
							<c:otherwise>
								<TD>${free}</TD>
							</c:otherwise>
						</c:choose>
					</c:forEach>
				</c:forEach>
			</TR>
		</c:forEach>
	</tbody>
</TABLE>

один цикл должен быть по строкам (tr), внутри него второй цикл по ячейкам (td), любой другой цикл не должен добавлять не лишних td, не лишних tr

ладно, не мучайся, если не понял, о чём я: <td> должен быть непосредственно во втором по вложенности цикле, а само содержимое этого td выводиться в третьем по вложенности цикле

Спасибо всем, кто откликнулся и помог! Реализовал таки это штуку.

Теперь на повестке дня у меня другой вопрос. Как сделать так, что выбирая свободные места в зале, по нажатию на них, брался ряд и место?
В данный момент я реализовал только по нажатию смену картинки.

Подтолкните в какую сторону развивать идею, чтоб оно взяло значения [3,6] [3,7] [4,6] [4,7]. Потом эти значения надо будет передать в сервлет.

индексы можно взять
http://www.w3schools.com/jsref/prop_..._cellindex.asp
http://www.w3schools.com/jsref/prop_...w_rowindex.asp

а как ты сейчас меняешь картинку?
вдобавок к посту animhotep, гугли event.target, тема заезженная

Спасибо за наводку=)
Оке, гляну сейчас=)
В данный момент смена происходит по этому скрипту:

<script>
	var x=false;
	function imgchange(obj,imgX,imgY) {
   		if  (x){
  			obj.src=imgX;
   		} else {
   			obj.src=imgY;
   		}
  		x=!x;
 	}
</script>

Но приходится почему-то нажимать не 1 раз, а 2 если выбираю другую картинку. По одной картинке всё нормально делает.
Сейчас почитаю про event.target и буду думать как реализовать чтоб при выборе места создавало какое-либо скрытое поле и туда записывало ряд и место, а при снятии выделения убирало эту строку.

выделение наверное будешь оформлять каким-либо классом, тогда при отправке данных лучше просто взять данные из ячеек с этим классом