The code below should display a message, depending on the result of another function. However, only the test message in eventListener is appearing. Which of these two should I edit?
<nav>
<div class="logo">
<h1>iConsult | <span>Appointment Scheduling System</span></h1>
</div>
</nav>
<form id="signupForm">
<input type="text" placeholder="Enter your full name" id="signupName" required>
<br>
<input type="email" placeholder="Enter your email" id="signupEmail" required>
<br>
<label for="position">Position:</label>
<select name="Position" id="position" required>
<option value="student">Student</option>
<option value="teacher">Teacher</option>
</select>
<br>
<label for="strand">Strand:</label>
<select name="Strand" id="Strand" required>
<option value="">--Please select your strand below:--</option>
<option value="abm">ABM</option>
<option value="ESTEM-C">ESTEM-C</option>
<option value="ESTEM-E">ESTEM-E</option>
<option value="ESTEM-H">ESTEM-H</option>
<option value="HUMSS">HUMSS</option>
<option value="TVL">TVL</option>
<option value="N/A">N/A (For teachers)</option>
</select>
<br>
<input type="text" placeholder="Section" id="Section">
<br>
<input type="button" class="button" value="Submit" id="signupButton">
</form>
<script>
function submitSUForm() {
var name = document.getElementById("signupName").value;
var email = document.getElementById("signupEmail").value;
var position = document.getElementById("position").value;
var strand = document.getElementById("Strand").value;
var section = document.getElementById("Section").value;
google.script.run.signupUser(name, email, position, strand, section);
}
document.addEventListener('DOMContentLoaded', function() {
const signupButton = document.getElementById('signupButton');
signupButton.addEventListener('click', function() {
console.log("Signup button clicked");
alert("Form Submitted"); // For testing purposes
submitSUForm();
});
function onSignupSuccess(result) {
if (result) {
alert('Registration Successful');
} else {
alert('Registration failed!');
}
}
});
</script>
</body>
Google script code:
return HtmlService.createHtmlOutputFromFile('dbpage');
}
function signupUser(signupName, signupEmail, position, strand, section, password, confirmPassword) {
if (signupName === '' || signupEmail === '' || position === '' || strand === '' || section === '' ) {
return false; // Empty fields are not allowed
}
var sheet = SpreadsheetApp.openById('YAn_AeK3uEQK77oOtGCVOI12TJHWN0QE').getSheetByName('Login');
var data = sheet.getDataRange().getValues();
for (var i = 1; i < data.length; i++) {
if (data[i][2] === signupEmail) {
return false; // Duplicate email found
}
}
// Append new user data
sheet.appendRow([signupName, signupEmail, position, strand, section]);
return true; // Signup successful
}
function mySleep (sec) {
SpreadsheetApp.flush();
Utilities.sleep(sec*1000);
}
I want to return a ‘Registration Successful’ message if it’s okay, and ‘Registration Failed, email exists already.’ message if the result is otherwise.