http://www.codefundamentals.com/contact.php
http://www.codefundamentals.com/unsubscribe.php
http://www.codefundamentals.com/scripts/scripts.js
All 3 validations are failing. The contact form, the right navigation, and then the unsubscribe form. They all use the same event handler. Could someone please help me get this fixed ASAP? I have server-side validation but this is the last thing holding me up…They WERE working not too long ago but I tinkered with some stuff.
The unsubscribe one is the only one not working. No clue why.
The event isn’t being added on unsubscribe…All the HTML matches and everything…dunno why this one is being excluded.
So the eventlistener isn’t working?
I got an error message in the console
TypeError: elem is null
And some nasty alerts
My guess is the problem lies here
var myForm = document.getElementById("subscribe-form");
var myFormTwo = document.getElementById("contact-form");
var myFormThree = document.getElementById("unsubscribe-form");
addEvent( myForm, 'submit', validateSubscribeForm );
addEvent( myFormTwo, 'submit', validateContactForm );
addEvent( myFormThree, 'submit', validateUnsubscribe );
I was messing with it. Please look again @Mittineague
http://www.codefundamentals.com/unsubscribe.php
On contact.php, there’s no #unsubscribe-form and on unsubscribe.php there’s no #contact-form
Maybe just do:
if(elem && elem.addEventListener)
on line 163 or similar to check if elem is set
lol, I was wondering why things were testing out sporadically 
Unless I’m going crazy, your first sentence makes 0 sense considering what I have in my PHP file.
When I checked the HTML source, they weren’t there. Maybe I just happened to see it when you were working on it?
Please look again. You also switched up the HTML elements. You’re saying my one page has the OTHER form ID and vice versa. You are scaring me.
Here. This scares me. Contact is working. Newsletter is working(subscribe).
Unsubscribe is only one not working.
else jumped ship (but not far)
if (elem.addEventListener)
{
elem.addEventListener(event, listenHandler, false);
}if(elem && elem.addEventListener)
else
{
elem.attachEvent("on" + event, attachHandler);
}
Ah, now I understand the problem
Try
var myForm = document.getElementById("subscribe-form");
var myFormTwo = document.getElementById("contact-form");
var myFormThree = document.getElementById("unsubscribe-form");
var inputs = document.getElementsByTagName('input');
if (myForn) {
addEvent( myForm, 'submit', validateSubscribeForm );
}
if (myFormTwo) {
addEvent( myFormTwo, 'submit', validateContactForm );
}
if (myFormThree) {
addEvent( myFormThree, 'submit', validateUnsubscribe );
}
the code is trying to addEvent even when getElementById returns null
Haha sorry I was rushing since I knew you were working on it. Here’s the long answer:
var myForm = document.getElementById("subscribe-form");
var myFormTwo = document.getElementById("contact-form");
var myFormThree = document.getElementById("unsubscribe-form");
var inputs = document.getElementsByTagName('input');
addEvent( myForm, 'submit', validateSubscribeForm );
addEvent( myFormTwo, 'submit', validateContactForm );
addEvent( myFormThree, 'submit', validateUnsubscribe );
myFormThree === null when you’re on contact.php, and myFormTwo === null when on unsubscribe.
The error on line 163 is Cannot read property 'addEventListener' of null for both, because one isn’t set on the other (hard to word this). You just have to check for null and you should be ok (you might need to do this in more than one place).
Updated. Now all 3 are not working.
I had an old version of your code Mitt. (I saw you spellcheck your “myForn”).
I also had if myFormThree(){etc} which broke it.
It is all working now. Thank you both. “Likes” across the board.
Feel free to check our the review for more help if you want . Site is finished.
http://www.sitepoint.com/community/t/redesign-of-codefundamentals/109126/2
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.