[pass-reset_script] Script now uses a <p> tag under the form instead of alerts or console to show status of message

src/PassReset/formHandler.js

@@ -26,11 +26,19 @@ formEl.addEventListener('submit', () => {
         fetch('https://reqres.in/api/update', {
             method: 'POST',
             body: object
-        }).then(res => console.log(res)).catch(error => console.log(error));
+        }).then(res => {
+            if(res.status === 200) {
+                document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success</span>";
+            } else if (res.status === 500){
+                document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failure</span>";
+            } else {
+                document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failure: Failed to communicate to server</span>";
+            }
+        }).catch(error => document.getElementById('formStatus').innerHTML = "<span style='background-color: yellow; color: black'>Please try again</span>");
         //TODO: Change this to changing a div in html
         //alert("Success");
     } else {
         //TODO: Change this to changing a div in html
-        alert("Failure")
+        document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failure: new passwords don't match</span>";
     }
 });

src/PassReset/index.html

@@ -16,6 +16,7 @@
     <input type="password" id="newPW2" name="newPWConfirm" /> <br />
     <input type="Submit" value="Submit" />
 </form>
+<p id="formStatus"></p>
 <footer>
     UL Computer Society 2023-<span id="year">2023</span>
 </footer>