0

I am missing something really obvious here, this is my first attempt at Javascript. I am trying to click radio buttons to fill out some forms, and the code is all pretty straightforward...

Firefox says that streetInput is null. This happens when I click a radiobutton. Streetinput is the id for the form to be filled out.

textContent is supposed to fill out the forms with the given text, but it doesn't. None of it does.

Chrome says script.js:37 Uncaught TypeError: Cannot read property 'addEventListener' of null 

var homeOption = document.querySelector(".homeoption");
var workOption = document.querySelector(".workoption");
var streetInput = document.querySelector(".streetinput");
var cityInput = document.querySelector(".cityinput");
var stateInput = document.querySelector(".stateinput");
var zipInput = document.querySelector(".zipinput");

function HomeFillout() {

    streetInput.textContent = "1 Main St.";
    cityInput.textContent = "Sicilia";
    stateInput.textContent = "ME";
    zipInput.textContent = "03900";
    if (form.checkValidity() === true) {
        submitButton.className = "submitbutton show";
    }
}

function WorkFillout() {


    streetInput.textContent = "15 Columbine Ln.";
    cityInput.textContent = "Crab City";
    stateInput.textContent = "ME";
    zipInput.textContent = "04993";
    if (form.checkValidity() === true) {
        submitButton.className = "submitbutton show";
    }
}

homeOption.addEventListener("click", HomeFillout, false);
workOption.addEventListener("click", WorkFillout, false);
Barmar
  • 596,455
  • 48
  • 393
  • 495
Joshua Ventresca
  • 1
  • `var homeOption = document.querySelector(".homeoption");` the problem is here, are you sure your query is selecting an element? Run `homeOption` in Google's inspect and see what you get? – Mustafa Apr 27 '18 at 23:36
  • 1
    It is telling you that `querySelector()` calls returned null, you should check your calls actually returned something before trying to use them. – Patrick Evans Apr 27 '18 at 23:36
  • I'd try selecting element with `getElementById` too – Mustafa Apr 27 '18 at 23:39
  • If `homeoption` is the id for the element, then you need to use `document.querySelector("#homeoption")`. Using `.` is for selecting classes. – BShaps Apr 27 '18 at 23:39

0 Answers0