[FIX]収支の選択に合わせてカテゴリが出るようにしました。

src/main/resources/templates/transaction_create.html

@@ -113,7 +113,7 @@
 
 	<div th:replace="~{footer :: footer}"></div>
 
-	<script inline="javascript">
+	<script th:inline="javascript">
 			const transactionType = document.getElementById("transactionType");
 			const categoryId = document.getElementById("categoryId");
 
@@ -122,16 +122,9 @@
 
 			const tType = '[[${session.tType}]]';
 			
-		if (tType == "0") {
+			function toggleCategory() {
-			transactionType.value = 0;
-		} else if (tType == "1") {
-			transactionType.value = 1;
-		}
 
-		
+			    if (transactionType.value === "0") {
-		transactionType.addEventListener("change", function () {
-
-			if (this.value === "0") {
 
 			        for (let i = 0; i < expenseList.length; i++) {
 			            expenseList[i].style.display = "";
@@ -141,7 +134,7 @@
 			            incomeList[i].style.display = "none";
 			        }
 
-			} else if (this.value === "1") {
+			    } else if (transactionType.value === "1") {
 
 			        for (let i = 0; i < expenseList.length; i++) {
 			            expenseList[i].style.display = "none";
@@ -161,9 +154,24 @@
 						incomeList[i].style.display = "none";
 					}
 				}
+			}
+
+			transactionType.addEventListener("change", function () {
+
+			    toggleCategory();
 
 			    categoryId.value = "";
+
 			});
+			
+			if (tType == "0") {
+				transactionType.value = "0";
+			} else if (tType == "1") {
+				transactionType.value = "1";
+			}
+			
+			toggleCategory();
+			
 		</script>
 
 

src/main/resources/templates/transaction_update.html

@@ -156,7 +156,7 @@
     <div th:replace="~{footer :: footer}">
     </div>
 
-	<script inline="javascript">
+	<script th:inline="javascript">
 		const transactionType = document.getElementById("transactionType");
 		const categoryId = document.getElementById("categoryId");
 
@@ -165,16 +165,9 @@
 
 		const tType = '[[${session.tType}]]';
 		
-		if (tType == "0") {
+		function toggleCategory() {
-			transactionType.value = 0;
-		} else if (tType == "1") {
-			transactionType.value = 1;
-		}
 
-		
+		    if (transactionType.value === "0") {
-		transactionType.addEventListener("change", function () {
-
-			if (this.value === "0") {
 
 		        for (let i = 0; i < expenseList.length; i++) {
 		            expenseList[i].style.display = "";
@@ -184,7 +177,7 @@
 		            incomeList[i].style.display = "none";
 		        }
 
-			} else if (this.value === "1") {
+		    } else if (transactionType.value === "1") {
 
 		        for (let i = 0; i < expenseList.length; i++) {
 		            expenseList[i].style.display = "none";
@@ -204,9 +197,24 @@
 					incomeList[i].style.display = "none";
 				}
 			}
+		}
+
+		transactionType.addEventListener("change", function () {
+
+		    toggleCategory();
 
 		    categoryId.value = "";
+
 		});
+		
+		if (tType == "0") {
+			transactionType.value = "0";
+		} else if (tType == "1") {
+			transactionType.value = "1";
+		}
+		
+		toggleCategory();
+		
 	</script>