#100DaysOfCode in Python Transcripts
Chapter: Days 85-87: Fullstack web apps made easy
Lecture: Building the Add new document form
Login or
purchase this course
to watch this video and the rest of the course contents.
0:00
Alright, our next goal is going to work on, to be working on this add_doc_form here. So what we want to do is we want to be able to drop in
0:10
some pieces, so we're going to come over and add a little sublabel, and this is going to control, this is going to basically be the label in our form.
0:18
We don't really program against it, so we don't need to set the name, but this'll be document name.
0:24
And let's make it a little more standout, make it bold. Okay. And then, we're going to have a text area where they can type.
0:31
Notice I can drop it in these different locations. I'll drop it right here. We can tighten that up by dragging that bit over.
0:42
Now this one, let's give this a name, such as, like, textbox_doc_name. And let's give it a placeholder document_name like that.
0:55
I'll do exactly the same thing for the rest of the elements. Okay, so I've done a little draggy droppy magic, and gotten this far.
1:09
We have a document name, we have a category, and this is going to be a dropdown, we'll fill that up. This is going to be a text area, and we should
1:15
go ahead and give this a placeholder so people see and document this little placeholder, which'll only be there until they type text,
1:24
and we have this button, create document. Let's do a little more work on this. We want this to align to the right over here. We want an icon.
1:34
Little plus sign, and let's change the color here. Go with this blue, which I just grabbed off somewhere on my screen, and let's make this,
1:45
you can type hex here if you want. Three F's for white. Okay, so there's our create document. Let's go ahead and run this, see how it works.
1:52
Again, we can click around. And now we can add a new document. It says document name, the name,
1:58
look how cool that is, it's got nice little bootstrap forms, nothing in our dropdown yet, contents here. Nothing happens when we click,
2:04
but that's going to be what we do next, is we're going to make this interactive and do a little validation.