tdの動的な結合方法

実現したいこと

tableでの予約カレンダーを実装

予約が入っている場合、その開始時間から終了時間までtdが結合するようにする

前提

初学者です。
jspファイルで施設の予約カレンダーを作成しようとしています。
tableで、部屋ごとに列を作成し、一番左のtdに時刻(15分刻み)を表示させています。
予約が入っている時間のtdを結合して、予約情報を表示させたいと考えています。
しかし、今私が作成したソースコードでは、<td>の中で予約があるかどうか調べているため、
rowspanを動的に変える方法が分かりません。
いたらない質問で恐縮ですが、
どうかご教授いただきたく存じます。

該当のソースコード

jsp
1<%@page import="entity.FacilityInfo"%>
2<%@page import="entity.ReservationInfo"%>
3<%@page import="java.util.ArrayList"%>
4<%@page import="java.time.LocalTime"%>
5<%@page import="java.time.temporal.ChronoUnit"%>
6<%@page import="java.util.List"%>
7<%@ page language="java" contentType="text/html; charset=UTF-8"
8	pageEncoding="UTF-8"%>
9<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
10<!DOCTYPE html>
11<html>
12<head>
13<meta charset="UTF-8">
14<link rel="stylesheet" type="text/css" href="calendar.css" />
15<title>Insert title here</title>
16</head>
17<body>
18	<%
19	//時間リスト
20	List<LocalTime> timeList = new ArrayList<>();
21	LocalTime startTime = LocalTime.parse("09:00");
22	LocalTime endTime = LocalTime.parse("18:00");
23	while (startTime.isBefore(endTime) || startTime.equals(endTime)) {
24		timeList.add(startTime);
25		startTime = startTime.plusMinutes(15);
26	}
27
28	//施設リスト
29	List<FacilityInfo> facilityList = new ArrayList<>();
30	//FacilityInfo（施設ID(facility_Id:int)と施設名(facility_Name:String)を持つ）
31	FacilityInfo facilityInfo = null;
32	for (int i = 1; i < 5; i++) {
33		facilityInfo = new FacilityInfo(i, "会議室" + i);
34		facilityList.add(facilityInfo);
35	}
36
37	//予約情報リスト
38	List<ReservationInfo> reservationList = new ArrayList<>();
39	//ReservationInfo(ID、施設ID、予約開始時間(startTime: LocalTime)、予約終了時間(endTime: LocalTime)を持つ)
40	ReservationInfo reservationInfo = new ReservationInfo(1, 1, LocalTime.parse("09:00"), LocalTime.parse("12:00"));
41	reservationList.add(reservationInfo);
42	reservationInfo = new ReservationInfo(2, 1, LocalTime.parse("15:00"), LocalTime.parse("17:00"));
43	reservationList.add(reservationInfo);
44	reservationInfo = new ReservationInfo(3, 2, LocalTime.parse("10:00"), LocalTime.parse("12:00"));
45	reservationList.add(reservationInfo);
46	reservationInfo = new ReservationInfo(4, 4, LocalTime.parse("10:00"), LocalTime.parse("12:00"));
47	reservationList.add(reservationInfo);
48	%>
49	<%!
50	//tdを結合するときのrowspanを計算する
51	public static long getRowCount(ReservationInfo reservationInfo){
52		long delta = reservationInfo.getStartTime().until(reservationInfo.getEndTime(), ChronoUnit.MINUTES);
53		long rowCount = delta/15;
54		return rowCount;
55	}
56	%>
57	
58<table>
59	<tr>
60		<th></th>
61		<%for(FacilityInfo facility: facilityList){ %>
62			<th><%=facility.getFaciilityName() %></th>
63		<%} %>
64	</tr>
65		<%List<ReservationInfo> notDisplayedList = new ArrayList<>(reservationList);%>
66		<%ReservationInfo reservation; %>
67		<%for(LocalTime time: timeList){ %>
68		<tr>
69			<td><%=time %></td>
70			<%boolean reservationFlag = false;%>
71			<%for(FacilityInfo facility2: facilityList){ %>
72			<td>
73				<%
74				for(int i = 0; i < notDisplayedList.size(); i++){
75					reservation = notDisplayedList.get(i);
76					LocalTime reservationStartTime = reservation.getStartTime();
77					LocalTime reservationEndTime = reservation.getEndTime();
78					//予約の施設IDと開始時間~終了時間がセルの施設列、時間行の値と一致したら予約情報を表示させる
79					if(reservation.getFacilityId() == facility2.getFacilityId() && reservationStartTime.equals(time)){%>
80						<%=reservation.getId()%>
81						<%reservationFlag = true%>
82					<%}%>
83				<%}%>
84			</td>
85			<%} %>
86		<%} %>
87		</tr>
88</table>
89</body>
90</html>

java
1package entity;
2
3import java.util.Objects;
4
5public class FacilityInfo {
6	private int facilityId;
7	private String faciilityName;
8
9	public FacilityInfo(int facilityId, String faciilityName) {
10		super();
11		this.facilityId = facilityId;
12		this.faciilityName = faciilityName;
13	}
14
15	public int getFacilityId() {
16		return facilityId;
17	}
18
19	public void setFacilityId(int facilityId) {
20		this.facilityId = facilityId;
21	}
22
23	public String getFaciilityName() {
24		return faciilityName;
25	}
26
27	public void setFaciilityName(String faciilityName) {
28		this.faciilityName = faciilityName;
29	}
30
31	@Override
32	public int hashCode() {
33		return Objects.hash(faciilityName, facilityId);
34	}
35
36	@Override
37	public boolean equals(Object obj) {
38		if (this == obj)
39			return true;
40		if (obj == null)
41			return false;
42		if (getClass() != obj.getClass())
43			return false;
44		FacilityInfo other = (FacilityInfo) obj;
45		return Objects.equals(faciilityName, other.faciilityName) && facilityId == other.facilityId;
46	}
47
48}
49

java
1package entity;
2
3import java.time.LocalTime;
4import java.util.Objects;
5
6public class ReservationInfo {
7	private int id;
8	private int facilityId;
9	private LocalTime startTime;
10	private LocalTime endTime;
11
12	public ReservationInfo(int id, int facilityId, LocalTime startTime, LocalTime endTime) {
13		super();
14		this.id = id;
15		this.facilityId = facilityId;
16		this.startTime = startTime;
17		this.endTime = endTime;
18	}
19
20	public int getId() {
21		return id;
22	}
23
24	public void setId(int id) {
25		this.id = id;
26	}
27
28	public int getFacilityId() {
29		return facilityId;
30	}
31
32	public void setFacilityId(int facilityId) {
33		this.facilityId = facilityId;
34	}
35
36	public LocalTime getStartTime() {
37		return startTime;
38	}
39
40	public void setStartTime(LocalTime startTime) {
41		this.startTime = startTime;
42	}
43
44	public LocalTime getEndTime() {
45		return endTime;
46	}
47
48	public void setEndTime(LocalTime endTime) {
49		this.endTime = endTime;
50	}
51
52	@Override
53	public int hashCode() {
54		return Objects.hash(endTime, facilityId, id, startTime);
55	}
56
57	@Override
58	public boolean equals(Object obj) {
59		if (this == obj)
60			return true;
61		if (obj == null)
62			return false;
63		if (getClass() != obj.getClass())
64			return false;
65		ReservationInfo other = (ReservationInfo) obj;
66		return Objects.equals(endTime, other.endTime) && facilityId == other.facilityId && id == other.id
67				&& Objects.equals(startTime, other.startTime);
68	}
69
70}

jimbe

2023/09/16 18:13 編集

>tdを結合して、～しかし～ <td>の中で～調べているためなら、 td の外で調べれば良いのでは無いでしょうか。ちなみに成功したらどのような html になるはずなのでしょう。

行動規範の内容に同意します

回答1件

ベストアンサー

テーブルの枠に合わせて予定を探し、無かったら空の td 、有って開始時間が枠と同じなら時間数分の rowspan の td を書き、枠と違うなら何も書かないようにします。

jsp
1<%@page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>
2<%@page import="entity.Facility"%>
3<%@page import="entity.Reservation"%>
4<%@page import="entity.TableReader"%>
5<%@page import="java.time.LocalTime"%>
6<%@page import="java.time.temporal.ChronoUnit"%>
7<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
8<!DOCTYPE html>
9<html>
10<head>
11<meta charset="UTF-8">
12<link rel="stylesheet" type="text/css" href="calendar.css" />
13<title>予約テーブル</title>
14</head>
15<body>
16<table>
17    <%TableReader reader = new TableReader(); %>
18    <tr>
19        <th></th>
20        <%for(Facility facility: Facility.getList()) { %>
21        <th><%=facility.name %></th>
22        <%} %>
23    </tr>
24    <%LocalTime start = LocalTime.of(9,0); %>
25    <%LocalTime endExclusive = LocalTime.of(18,0); %>
26    <%for(LocalTime time=start; time.isBefore(endExclusive); time=time.plusMinutes(Reservation.TIME_UNIT)) { %>
27    <tr>
28        <td><%=time %></td>
29        <%for(Facility facility: Facility.getList()) {
30            Reservation reservation = reader.findReservation(time, facility.id);
31            if(reservation == null) { %>
32        <td bgcolor="#dddddd"></td>
33          <%} else if(reservation.start.equals(time) || time == start) {
34              long max = time.until(endExclusive, ChronoUnit.MINUTES) / Reservation.TIME_UNIT;
35              long rowspan = Math.min(time.until(reservation.endExclusive, ChronoUnit.MINUTES) / Reservation.TIME_UNIT, max); %>
36        <td bgcolor="#aaaaaa" rowspan="<%=rowspan %>"><%=reservation.id %></td>
37          <%} %>
38        <%} %>
39    </tr>
40    <%} %>
41    <tr>
42        <td><%=endExclusive %></td>
43    </tr>
44</table>
45</body>
46</html>

entity/Facility.java ( FacilityInfo クラスを不変・マスタ化, フィールド名変更等 )

java
1package entity;
2
3import java.util.*;
4
5public class Facility {
6  private static List<Facility> list;
7
8  public static List<Facility> getList() {
9    if(list == null) {
10      list = Collections.unmodifiableList(Arrays.asList(
11          new Facility(1,"会議室1"),
12          new Facility(2,"会議室2"),
13          new Facility(3,"会議室3"),
14          new Facility(4,"会議室4")
15      ));
16    }
17    return list;
18  }
19
20  public final int id;
21  public final String name;
22
23  private Facility(int id, String name) {
24    this.id = id;
25    this.name = name;
26  }
27
28  @Override
29  public String toString() {
30    return "Facility [id=" + id + ", name=" + name + "]";
31  }
32}

entity/Reservation.java ( ReservationInfo クラスを不変化, 定数・メソッド追加等)

java
1package entity;
2
3import java.time.LocalTime;
4import java.util.Objects;
5
6public class Reservation {
7  public static final int TIME_UNIT = 15; //[minute]
8
9  public final int id;
10  public final int facilityId;
11  public final LocalTime start, endExclusive;
12
13  public Reservation(int id, int facilityId, LocalTime start, LocalTime endExclusive) {
14    if(start.getMinute()%TIME_UNIT != 0)  throw new IllegalArgumentException("start=" + start);
15    if(endExclusive.getMinute()%TIME_UNIT != 0)  throw new IllegalArgumentException("endExclusive=" + endExclusive);
16    if(!start.isBefore(endExclusive)) throw new IllegalArgumentException("start=" + start + ", endExclusive=" + endExclusive);
17
18    this.id = id;
19    this.facilityId = facilityId;
20    this.start = start;
21    this.endExclusive = endExclusive;
22  }
23
24  public boolean inTimeRange(LocalTime time) {
25    return start.equals(time) || (start.isBefore(time) && endExclusive.isAfter(time));
26  }
27
28  @Override
29  public int hashCode() {
30    return Objects.hash(id, facilityId, start, endExclusive);
31  }
32  @Override
33  public boolean equals(Object obj) {
34    if(this == obj) return true;
35    if(obj == null || getClass() != obj.getClass()) return false;
36    Reservation other = (Reservation)obj;
37    return id == other.id && facilityId == other.facilityId
38        && Objects.equals(start, other.start) && Objects.equals(endExclusive, other.endExclusive);
39  }
40  @Override
41  public String toString() {
42    return "Reservation [id=" + id + ", facilityId=" + facilityId
43        + ", start=" + start + ", endExclusive=" + endExclusive + "]";
44  }
45}

entity/TableReader.java ( 新規, オリジナル jsp にあった処理を移動等 )

java
1package entity;
2
3import java.time.LocalTime;
4import java.util.*;
5
6public class TableReader {
7  private List<Reservation> reservationList;
8
9  public TableReader() {
10    //テストデータ
11    reservationList = new ArrayList<>();
12    reservationList.add(new Reservation(1, 1, LocalTime.of( 9, 0), LocalTime.of(12, 0)));
13    reservationList.add(new Reservation(2, 1, LocalTime.of(15, 0), LocalTime.of(17, 0)));
14    reservationList.add(new Reservation(3, 2, LocalTime.of(10, 0), LocalTime.of(12, 0)));
15    reservationList.add(new Reservation(4, 4, LocalTime.of(10, 0), LocalTime.of(12, 0)));
16  }
17
18  public Reservation findReservation(LocalTime time, int facilityId) {
19    for(Reservation reservation : reservationList) {
20      if(reservation.inTimeRange(time) && reservation.facilityId == facilityId) return reservation;
21    }
22    return null;
23  }
24}