#100DaysOfCode in Python Transcripts
Chapter: Days 85-87: Fullstack web apps made easy
Lecture: Processing add new document
Login or
purchase this course
to watch this video and the rest of the course contents.
0:00
We have our ad new document form here,
0:03
and it's working pretty well in terms of UI,
0:05
but it has no responsiveness, nothing happens right?
0:08
So let's go to the code side and add that.
0:11
First thing that we want to do is we want to
0:12
populate this combo box here.
0:15
Now you can go type in the items,
0:17
if this was like a set of things you knew,
0:19
like what color of items you want?
0:21
we only have three colors, type it in here.
0:23
Or what month of the year?
0:25
that doesn't change just type it here.
0:27
But, when we're working with things
0:30
that are going to change,
0:31
like categories out of our database,
0:33
we want to do that in code.
0:35
So, let's write some categories.
0:38
Now, for just until we get to the database part,
0:40
I'm going to just type them out here.
0:44
Let's suppose we have four categories that
0:46
we're ultimately going to store in the database
0:48
that can change and grow.
0:50
Then we'd able to do things like go to the database
0:52
and say show me all the documents that have science,
0:55
that are tagged with science or something to that effect.
0:58
So we'll go over here, and we'll go to self.dropdown.items
1:03
I want to set that to two things.
1:05
What we need to do is give it a tuple,
1:07
for everything in the categories,
1:08
we want to give it a thing to show, and then the actual value.
1:12
So I actually want to have two things,
1:14
I want it to start out selected with just nothing.
1:17
So let's say something like this.
1:24
So, this is what's going to appear,
1:25
the words select the category with the value of None,
1:28
so we can test that they're selected nothing.
1:30
And in here, we're going to create a c, c
1:34
maybe we'd use ID or something,
1:36
for now we're just going to use this.
1:37
For c categories, I'll test that.
1:42
Select a category, oh yeah that's sweet.
1:45
Okay, so this is good.
1:48
Now the next interesting thing really has to do
1:50
when we click on this button.
1:52
I'm going to click on button six,
1:53
so if I just double click right here,
1:55
it's going to add that code.
1:57
Let's tighten that up a little.
1:58
It's going to call this function.
2:00
So we either want to save the thing and maybe navigate away,
2:05
or if there's missing data,
2:07
like they haven't given it a name,
2:08
they can't save it right?
2:09
So let's do a little validation bit here.
2:14
Now let me just type this out
2:15
and then I'll talk you through it.
2:18
Alright, so we're going to do a quick validation.
2:19
And the way we get the values, out of say the text box,
2:22
is just the dot text properties.
2:24
And we're also going to strip that down,
2:26
make sure they didn't just put white space.
2:28
For the drop down, it's selected value right,
2:30
that's the second element right here.
2:33
Either the text of the category or nothing.
2:36
And if they haven't typed anything into this textarea,
2:39
a multiline text box, then we're going to say you
2:42
can't create empty documents.
2:43
So let's go over here,
2:47
we don't have to pass anything along,
2:49
because these are all part of this object here.
2:52
Now if there are errors, more than one,
2:53
we want to show them all.
2:54
So we'll say if errors, and then what do we do here?
2:59
Let's add a label where we can put an error,
3:02
maybe give it a nice color.
3:05
We can use a little divider here like this.
3:14
Here we go, made it a little bold,
3:15
put it in the center, give it a nice red color,
3:17
say this is an error.
3:19
Now when it runs, before there's errors,
3:21
we don't want that to show up right?
3:22
We don't see this is an error.
3:25
So let's go and have that removed.
3:26
Also, I put a divider,
3:27
but for the sake of size, let's do this.
3:30
So at the beginning, we're going to come over here
3:32
and just say
3:36
clear this out.
3:37
But if for some reason there is an error,
3:41
we want to set this.
3:42
And let's actually do a cool little trick here.
3:44
We'll say join
3:48
on the error.
3:49
So when they get a list of errors,
3:50
and then we're going to separate them with new lines,
3:52
which preserve themselves from when this ges to the web.
3:54
So let's try this, try our validation.
3:57
So if I just hit go, we should get three errors.
4:00
Bam, look at that.
4:01
Document name is required,
4:02
document category is required,
4:04
and cannot create empty documents.
4:05
Let's pick science.
4:07
Now just the name is required.
4:09
The name, now some details have to be provided.
4:16
Now that almost worked, didn't it?
4:18
Actually, there's no more errors,
4:20
we just need to call this at the beginning every time.
4:23
So let's go over here,
4:25
and zero that out every time we validate,
4:28
or we could maybe do it here, take your pick.
4:32
Or do it else, whatever.
4:33
I'll leave it like this.
4:38
Now once I fill this out,
4:40
boom, it's gone.
4:41
That would've created the document if we had implemented.
