diff --git a/src/main/java/uk/ac/cf/spring/demo/takeaway/index/ExchangeController.java b/src/main/java/uk/ac/cf/spring/demo/takeaway/index/ExchangeController.java
index 05f39957549c1724da51eb46baedbf449c6ba6b0..c0ed941a50c1ff9d19fc668a2fb2f2a6799ed4fc 100644
--- a/src/main/java/uk/ac/cf/spring/demo/takeaway/index/ExchangeController.java
+++ b/src/main/java/uk/ac/cf/spring/demo/takeaway/index/ExchangeController.java
@@ -26,8 +26,5 @@ public class ExchangeController {
         ExchangeItem exchangeItem = exchangeService.getExchangeItem(id);
         modelAndView.addObject("exchangeItem", exchangeItem);
         return modelAndView;
-
-
-
     }
 }
diff --git a/src/main/java/uk/ac/cf/spring/demo/takeaway/index/ExchangeItem.java b/src/main/java/uk/ac/cf/spring/demo/takeaway/index/ExchangeItem.java
index a43adecf17382fdc6c5ab439caf9c1c24bc7bbd9..a9a5e6e3b7f23da3fc4bfd7257eff2c4c1bc4314 100644
--- a/src/main/java/uk/ac/cf/spring/demo/takeaway/index/ExchangeItem.java
+++ b/src/main/java/uk/ac/cf/spring/demo/takeaway/index/ExchangeItem.java
@@ -9,6 +9,6 @@ public class ExchangeItem {
     private Long id;
     private String name;
     private String description;
-    private boolean ExchangeOrNot;
-    private boolean MoneyOrNot;
+    private boolean exchangeOrNot;
+    private boolean moneyOrNot;
 }
diff --git a/src/main/resources/templates/page/itemDetail.html b/src/main/resources/templates/page/itemDetail.html
index 9cb53111e374d2812be65b7290396d9f84ddbe69..d36d7d11f52be55c7111c373f11764ba573ade74 100644
--- a/src/main/resources/templates/page/itemDetail.html
+++ b/src/main/resources/templates/page/itemDetail.html
@@ -1,10 +1,55 @@
 <!DOCTYPE html>
 <html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>Title</title>
-</head>
-<body>
-    <div>itemDetail</div>
-</body>
+
+    <head>
+        <meta charset="UTF-8">
+        <title>Title</title>
+        <script>
+            function sendRequest() {
+                alert("exchange message send successful");
+            }
+        </script>
+    </head>
+    <body>
+<!--        <div>itemDetail</div>-->
+        <table>
+            <!--    thead-->
+            <thead>
+                <tr>
+                    <th>itemDetail</th>
+                </tr>
+            </thead>
+            <!--tbody-->
+            <tbody>
+                <tr>
+                    <td>Id</td>
+                    <td th:text="${exchangeItem.id}"></td>
+                </tr>
+                <tr>
+                    <td>ItemName</td>
+                    <td th:text="${exchangeItem.name}"></td>
+                </tr>
+                <tr>
+                    <td>Description</td>
+                    <td th:text="${exchangeItem.description}"></td>
+                </tr>
+                <tr>
+                    <td>exchangeOrNot</td>
+                    <td th:text="${exchangeItem.exchangeOrNot}"></td>
+                </tr>
+                <tr>
+                    <td>exchangeOrNot</td>
+                    <td th:text="${exchangeItem.moneyOrNot}"></td>
+                </tr>
+
+            </tbody>
+
+        </table>
+        <a th:href="@{/exchange}" style="text-decoration: none">
+            <button onclick="sendRequest()">EXCHANGE</button>
+        </a>
+        <a th:href="@{/exchange}" style="text-decoration: none">
+        <button>Cancel</button>
+        </a>
+    </body>
 </html>
\ No newline at end of file
diff --git a/src/main/resources/templates/page/itemList.html b/src/main/resources/templates/page/itemList.html
index 8a78b94d756568c3f9150968c33040df8c663021..26c9829041f1e689032de997370b166929efe47f 100644
--- a/src/main/resources/templates/page/itemList.html
+++ b/src/main/resources/templates/page/itemList.html
@@ -22,7 +22,7 @@
                 <td th:text="${exchangeItem.name}"></td>
                 <td th:text="${exchangeItem.description}"></td>
                 <td>
-                    <button><a th:href="@{/exchange/{link} (link=${exchangeItem.id})}">
+                    <button><a th:href="@{/exchange/{link} (link=${exchangeItem.id})}" style="text-decoration: none">
                         seeDetails
                     </a></button>
                 </td>