diff --git a/public/index.html b/public/index.html
index de024cccbabed5e8c87e0d5d67055d1656e21b54..1fa803477dae7f3e4941480ad57f1d8914d2888f 100644
--- a/public/index.html
+++ b/public/index.html
@@ -63,7 +63,7 @@
         <div>
           <label for="readerLevel">Reader Level:</label>
           <select class="box-input" id="readerLevel" onchange="readerLevelChangeEvent(event)">
-            <option value="">Select level</option>
+            <option value="0">Select level</option>
             <option value="1">First Year</option>
             <option value="2">Second Year</option>
             <option value="3">Third Year</option>
@@ -74,7 +74,7 @@
         <div>
           <label for="readerCategory">Reader Category:</label>
           <select class="box-input" id="readerCategory" onchange="readerCategoryChangeEvent(event)">
-            <option value="">Select category</option>
+            <option value="0">Select category</option>
             <option value="1">Mixed-ability group</option>
             <option value="2">High-ability group</option>
             <option value="3">Good-ability group</option>
diff --git a/public/index.js b/public/index.js
index 0395eb9676398dc6ae340f5f5a201a9a51d02413..b0141bf498e166b29c27185a38f6757566b72309 100644
--- a/public/index.js
+++ b/public/index.js
@@ -80,14 +80,14 @@ function isFormValid() {
         document.getElementById('textCharacters-validation').style.display = 'none';
     }
 
-    if (inputObj.readerLevel === '') {
+    if (inputObj.readerLevel === '' || inputObj.readerLevel === 0) {
         invalidFields++;
         document.getElementById('readerLevel-validation').style.display = 'block';
     } else {
         document.getElementById('readerLevel-validation').style.display = 'none';
     }
 
-    if (inputObj.readerCategory === '') {
+    if (inputObj.readerCategory === ''|| inputObj.readerCategory === 0) {
         invalidFields++;
         document.getElementById('readerCategory-validation').style.display = 'block';
     } else {