Add function to get genders per sport in submit form

database/scores/genders.js

@@ -13,18 +13,22 @@ async function retrieveBySport(sportID) {
 
     const gendersList = [];
 
-    if(table.length() == 2) {
+    if(table.length == 0) {
+        return gendersList;
+    }
+    if(table.length == 2) {
         gendersList.push(genders.female);
         gendersList.push(genders.male);
+        return gendersList;
     }
     else if(table[0][0] = "F") {
         gendersList.push(genders.female);
+        return gendersList;
     }
     else if(table[0][0] = "M") {
         gendersList.push(genders.male);
+        return gendersList;
     }
-
-    return gendersList;
 }
 
 

public/scripts/data.js

@@ -8,4 +8,10 @@ export async function getSeasons() {
     const response = await fetch('/data/seasons');
     const seasonsList = await response.json();
     return seasonsList;
+}
+
+export async function getGenders(sportID) {
+    const response = await fetch(`/data/genders?sport=${+sportID}`);
+    const gendersList = await response.json();
+    return gendersList;
 }

public/scripts/submit.js

@@ -3,6 +3,7 @@ import * as Data from "./data.js";
 
 const sportDropdown = document.getElementById('sport-dropdown');
 const seasonDropdown = document.getElementById('year-dropdown');
+const genderDropdown = document.getElementById('gender-dropdown');
 
 
 
@@ -30,4 +31,24 @@ async function listSeasons() {
         seasonDropdown.appendChild(option);
     });
 }
-listSeasons();
+listSeasons();
+
+async function listGenders() {
+    genderDropdown.innerHTML = "";
+
+    const selectedSportID = sportDropdown.value;
+    const gendersList = await Data.getGenders(selectedSportID);
+
+    gendersList.forEach(gender => {
+        const option = document.createElement('option');
+        option.text = (gender.name == "female") ? "Female" : (gender.name == "male") ? "Male" : "";
+        option.value = gender.name;
+        genderDropdown.appendChild(option);
+    });
+}
+
+
+
+
+
+sportDropdown.onchange = listGenders;

routes/data.js

@@ -2,6 +2,7 @@ var express = require('express');
 var router = express.Router();
 var sports = require('../database/scores/sports');
 var seasons = require('../database/scores/seasons');
+var genders = require('../database/scores/genders');
 
 
 router.get('/sports', function(req, res, next) {
@@ -14,4 +15,9 @@ router.get('/seasons', function(req, res, next) {
         .then(data => res.json(data));
 })
 
+router.get('/genders', function(req, res, next) {
+    genders.retrieveBySport(req.query.sport)
+        .then(data => res.json(data));
+})
+
 module.exports = router;

views/submit.pug

@@ -15,8 +15,6 @@ block content
       span(class='form-section-input')
         select#sport-dropdown(name="sport" class="main-dropdown") 
         select#gender-dropdown(name="gender")
-          option(value="Male" selected) Male 
-          option(value="Female") Female
         select#division-dropdown(name="division")
           option(value="Varsity") Varsity 
           option(value="JV-A") JV-A