Select List Input

[00:00:00]
>> Jen Kramer: Just have a couple more fields here to code on this form. And the next thing that we're going to do is and it looks like some of you might be working ahead a little bit, the type of abduction experience that you want and I gave you four choices here also [COUGH].

[00:00:15]
Now this would be a great thing to code with radio buttons, and I think some of you already did code with radio buttons. So that's just fine if you coded that with radio buttons. But there are some other form field types that I wanted to show you, and one of these is called select, and you've seen select before.

[00:00:32]
Here in the United States, it's very commonly used for a list of states. You click on the little arrow, you get this really long drop-down with all these different choices, and you can only pick one, right? Okay, so you here in the US, we see it with states, you might see a list of countries on a form, that's the kind of thing.

[00:00:50]
Let's go ahead and try coding a select list for this. Just like with radio buttons, a select list is designed to pick one thing, not a whole bunch of different things, just one thing on the list.
>> Jen Kramer: Okay, so, to put that code together, what we're going to do is up here, we are going to have a label for the type of abduction experience that you want.

[00:01:18]
This is going to be a label tag, and we're going to say it's for ab type. That's short for abduction type, ab type. You can call it anything you want, that's what I called mine. And then of course, ends with a slash label tag. And then here, it's no longer gonna be an unordered list, obviously, this is gonna be a select tag.

[00:01:44]
So select is the tag, and we're going to give it an ID. And what's my ID going to be?
>> Speaker 2: Ab type.
>> Jen Kramer: Ab type and how did you know that, Riley?
>> Speaker 2: Because that's what we call it a label.
>> Jen Kramer: That's what we called it in the foreign label.

[00:02:02]
Those two things have to be the same they need to match so that's exactly right. Okay, and then the end of that select is going to happen down where the previously where the slash UL was, that's going to be the end of the select, okay? Inside of this, we don't have li's, we actually have instead options.

[00:02:24]
So this is an option tag, which is gonna end with a slash option tag.
>> Jen Kramer: So you can go on ahead and copy and paste those in place. These are all gonna be option tags.
>> Jen Kramer: So selects are always gonna have options.