In Line JS

Same basic function except with another debug function added and using in-line javascript instead of a separate file.
mail@pastecode.io avatar
unknown
html
2 years ago
1.7 kB
2
Indexable
Never
  <head>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="..\static\style.css" />
    <link rel="icon" type="image/x-icon" href="../static/favicon.png" />
    <script src="https://d3js.org/d3.v7.min.js"></script>
    <script type="text/javascript">
      // 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()
      {
        // Retrieve Members.csv and create a variable to hold the data
        d3.csv("../data/Members.csv").then(function (data)) {
          var members = data;
        }
        // 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"]);

        function helloWorld()
        {
          alert("Ok");
        }
      }
    </script>
  </head>
  
  <body onload="helloWorld()">
    ...
  </body>