Client side validation for Enqueue form

Client side validation for Enqueue form

Since validation has been turned on constraint violation exceptions have been occurring when students did not enter a room, assignment or request type.

This marks the same fields as required in the form for the user.

src/main/resources/templates/lab/enqueue.html

@@ -69,7 +69,7 @@
 
             <div class="col-sm-8">
                 <select class="form-control" th:classappend="${#fields.hasErrors('assignment')} ? 'is-invalid'"
-                        id="inputAssignment" th:field="*{assignment}">
+                        id="inputAssignment" th:field="*{assignment}" required>
                     <option value="" th:selected="selected">Choose an assignment</option>
                     <option th:each="assignment : ${lab.assignments}" th:value="${assignment.id}"
                             th:text="${assignment.name}">Assembly programming
@@ -86,7 +86,7 @@
 
             <div class="col-sm-8">
                 <select class="form-control" id="inputRoom" th:field="*{room}"
-                        th:classappend="${#fields.hasErrors('room')} ? 'is-invalid'">
+                        th:classappend="${#fields.hasErrors('room')} ? 'is-invalid'" required>
                     <div>
                         <option value="" th:selected="selected">Choose a room</option>
                         <option th:each="room : ${lab.rooms}" th:value="${room.id}" th:text="${room}">DW 1.01</option>
@@ -101,7 +101,7 @@
 
             <div class="col-sm-8">
                 <select class="form-control" id="inputType" th:field="*{requestType}"
-                        th:classappend="${#fields.hasErrors('requestType')} ? 'is-invalid'">
+                        th:classappend="${#fields.hasErrors('requestType')} ? 'is-invalid'" required>
                     <option value="" th:selected="selected">Choose the type</option>
                     <option th:each="requestType : ${lab.allowedRequestTypes}" th:value="${requestType.id}"
                             th:text="${requestType.name}"></option>