app.js

Handles input and retrieving information from a .csv data file.
 avatar
unknown
javascript
3 years ago
1.3 kB
4
Indexable
// INPUT DETECTION
var button = d3.select("#button");
var form = d3.select("#form");
button.on("click", runEnter);
form.on("submit", runEnter);

// Retrieve Members.csv and create a variable to hold the data
d3.csv("data/Members.csv").then(function (data)) {
  var members = data;
}

// Function to compare the provided postcode to the postcodes column in the
// Members.csv file and retrieve the attached details of the member
function runEnter() {
  // Debug log to check if function has been called
  console.log("Function called!");
  // Clears the <tbody> from the html file
  d3.select("tbody").html("");
  // Prevents page from reloading
  d3.event.preventDefault();
  // Gets the users input from the postcode input
  var inputValue = d3.select("#user-input").property("value");
  // Filters the members based on the provided postcode
  var localMember = members.filter(members => members.Postcode.includes(inputValue));
  // Appends the details of the local member to the columns defined in the html file
  d3.select("tbody").insert("tr").html (
    "<td>" + (localMember["First Name" + "Surname"]) + "</a>" + "</td>" +
    "<td>" + (localMember["Electorate"]) + "</a>" + "</td>"
  );
  // Debug log to check if the function returned correct value
  console.log(localMember["Electorate"]);
}
Editor is loading...