HTML Forms

Debugging Submit Issues

Jen Kramer

AnnieCannons
HTML Forms

Check out a free preview of the full HTML Forms course

The "Debugging Submit Issues" Lesson is part of the full, HTML Forms course featured in this preview video. Here's what you'd learn in this lesson:

Jen goes over various things students can look for when debugging why their form is not submitting.

Preview
Close

Transcript from the "Debugging Submit Issues" Lesson

[00:00:00]
>> Speaker 1: So some of you are probably wondering at this point why it didn't work. And you might be wondering where some of the big pitfalls are in terms of configuring a form like this. And so a lot of these go back to our processing script and the way that processing script was put together, and its requirements.

[00:00:19]
So if you got any of its requirements wrong, the script is expecting certain things. If it doesn't get what it expects, then it just sort of throws up its hands and says, I don't know what to do, I'm just going to make an error. So things you need to be sure to get right.

[00:00:33]
First of all, make sure you have all the characters, and you copy that URL correctly. It's really easy to leave off a character here or there or forget something in the configuration of that form tag. So make sure you've copied the full URL and all the capitalizations and lower cases, all of that is all correct.

[00:00:55]
Make sure the method is set to post and not to get or to any of the other dialogues, values. Make sure that the value of your hidden form field is set to the email address you use to register for the boot camp. Those email addresses have been whitelisted, this is to prevent this script from getting out of control and spamming the entire globe with unsavory messages.

[00:01:18]
So make sure that that is an approved email address, and the way it's approved is because you used it to register for boot camp. Make sure the name of that hidden field is called send_to, all lower case, no hyphens. It's not one solid word. It is send_to, all lower case, just like that, and it is a name, not an ID.

[00:01:43]
As we go on down the page, in general, you need to be sure that the names of your form fields here are the same as what I have called my names in my form fields. You can change around the IDs here if you wish. That's fine. You can call the IDs whatever you want but the names as I have coded this form are important in order to make this script work.

[00:02:07]
Once again, this is the way the script has been coded. It's expecting these names to be submitted in order for the script to work correctly. So make sure you spell name correctly. Make sure you use the same spelling for all of the name fields here that I have used here.

[00:02:25]
No capital letters, no funny characters, make sure you spell them all correctly. And then finally, as always, you can always run your form through the HTML validator. Sometimes there'll be some other funny thing that, some other funny mistake you've made somewhere along the way. You forgot to close a tag, or you left out punctuation, or you literally spelled something wrong.

[00:02:51]
Computers are very literal, and these kinds of errors are going to throw everything off. If you put them in the validator, the validator will catch those mistakes for you, so that is a great check to make sure that everything else is correct in this particular script. Those are some of the typical things that can go wrong with the script.

[00:03:10]
Check those things and in all likelihood what you did was one of those things and if you don't see it right now, walk away, go take a little walk around the neighborhood, come back in a half an hour, or an hour or so, and look again, and it might pop right out at you.

[00:03:25]
So hopefully all your forms are working but this is the way web development is. Sometimes, things don't work, you need to go in, you need to double-check some of your settings. If your code is not working, one of the form fields doesn't have to be submitting, it's likely because the name is not what I used my example.

[00:03:46]
Look into the end folder, so you see how we have a begin folder and we have an end folder. Look in the end folder, and look at the names that I used, if they're in there, hopefully they're in there, if they're not, use the IDs, they're the same thing.

[00:04:01]
And make sure that those are the names that you are using for your form fields on your form as well. Because JavaScript is looking for those specific names, in order for things to work, okay? So double-check all of those names. After that, we're just gonna move on to the CSS.

[00:04:20]
All right, cuz goodness knows our forum is completely unusable the way it is. It looks horrible.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now