JSFiddle - React, Tailwind, and code Playground

by artee2025

HTML

<head>
<script src="https://d3js.org/d3.v5.min.js"></script>
</head>

<div class="item5">
    <p class="pform">Postcode</p>
    <form id="form">
      <input type="text" id="user-input">
      <input type="button" id="button" value="click here">
    </form>
  </div>

  <div class="item6">
    <thead>
      <tr>
        <th scope="col">Name</th>
        <th scope="col">Electorate</th>
      </tr>
    </thead>
    <tbody>
    </tbody>
  </div>

JavaScript

var button = d3.select("#button");
  var form = d3.select("#form");
  button.on("click", runEnter);
  form.on("submit", runEnter);

d3.csv("data/Members.csv").then(function (data) {
  var members = data;

})

function runEnter() {
/*   d3.select("tbody").html("");
  d3.event.preventDefault();
  var inputValue = d3.select("#user-input").property("value");
  var localMember = members.filter(members => members.Postcode.includes(inputValue));
  d3.select("tbody").insert("tr").html (
    "<td>" + (localMember["First Name" + "Surname"]) + "</a>" + "</td>" +
    "<td>" + (localMember["Electorate"]) + "</a>" + "</td>"
  ); */
  console.log(1 + 1);
  //console.log(localMember["Electorate"]);
}