Detailed Notes
We are continuing a series of tutorials focused on Spring Boot. The crux of the project is to convert/migrate an old JSP/Tomcat application to a modern Spring Boot application and Java 7/8 to a current version. This tutorial continues our code conversion as we add in filtering results by selecting a value and clean up our display of data.
You can learn more through our online classes at https://school.develpreneur.com and register for free. Registration will add you to our email list, and you will periodically receive coupons for courses and notifications of the latest releases.
Transcript Text
[Music] well hello and welcome back we are continuing converting our little application from Old School JSP to New School spring Boot and we are sort of in the middle of a little bit of a a minseries within this series and we're just working on like what we have is some projects and we're working on getting project list going and being able to edit a project because we want to be able to get in and turn this form on and be able to actually edit information now first we found last time had a couple little things we want to clean up a couple buttons and we want to be able to filter so we want to be able to come in here and say Hey I want everybody that is new and I want let's say I want everybody that is submitted or pending and if I do that then I'm not getting what I want I am getting that sent across I'm getting projects with a but it is not it is having an issue so let's take a look at that and let's see if we can get in if we're getting an error so if we go to new it tries to and it was an unexpected so uh oh let's see that was projects if it goes [Music] here uh oops let's do pending it is projects with a p so let's go look here at our uh we're going to look into our controller because that's probably where we need to go first so if we go find projects right here then one of the things that we have is no we do not have our second parameter uh in there at all so what we would need is probably a second param we can do a second one so we can do it with and just leave that as is and then we can say hey if we've got this then we can add a parameter I believe we have looked at that here before adding that second yeah so we did it like we did here and so we're going to take something let's go look at this very similar to what we did with edit project so now if we do projects uh second one there we go this is the second one and what we want to do is we're going to send a um let's call it a code which is our it's going to be a onlet code and then we're going to come in here and we're going to make sure that we have a path variable that will take that so we're going to do our request and we will do that I don't think we need a local but that's okay let's see what happens um if we do our and he's going to be a string it's actually going to be a character but that's okay and we're going to call him code and then here and we're going to do list projects let's see if we have uh project list and let's go see if we already have that built by a type so if we go into our Dao for our projects let's just go to our Dao let's see if we have something looks right so we have this is based on name here we go name and Status we have the same thing with a name and a status so that's going to be super easy because that means that we will be able to call this uh where do we call it list and we're just going to do it and we're going to add code to the end and we don't need that we don't need that and so let's see what happens now oh let's um let's go back to this though one of the things we were running into is we've got these really nasty buttons and let's make that button primary button primary and we are going to I think we can leave them just as is because I think we're going to be okay so if we go nbsp we're going to put a space on both wh I'm put space on both sides of this because I think it's going to be really tight without it we could go in and mess with the margins on our CSS we're not going to do that right now so let's see and that is do we want those on a different row yeah we're going to want those on a different row so then we're going to come in here and let's do this wh and well no we did not we wanted them on potentially the same row okay so let's put a space here oh yeah let's put a space after that in any case so even if we don't have a user we'll have that now let's go take a look at this stuff oh we also had another one here we had this new project thing let's make him also a primary uh button primary and let's go take a look at how this all looks so let's see if we got our filter going plus cleaned up a couple of our display issues so if we come in here and we log in and we go to projects list oh I didn't get that we did get it but they're still spreading all the way out so we will work on that in uh momentarily because it is let's look at this that's an H5 that's in that div so if it's there we want that in a row so we probably want do I have one I can just copy and paste real quick no so I'm going to take this and let's see within here he's going to do I call MD we'll call him an 11 and let's see if that gives me something now the other thing we wanted to do is whoops is we want to see if we can filter so now did we get our filter right so if we come into filter for new there we go now interesting thing is is it's getting us stuff but we have an issue here is it's getting us to apparently a different page or it's breaking something so let's go back and look at our hello hello hello hello controller and before we're doing projects and now we're doing projects which is a slightly different list now we do see um yeah see they're all if you look like here you can see they're all new so that's at least and oh and so we have got something simple that we blew up here so when it comes through oh it is probably because the model is not set up right did we have that before um we did okay so we had lcal and model and so I'm guessing that's going to be a problem we want him to be so he's project oh that's our problem he's got the same name uh projects filter so let's try that looking good didn't introduce something new come up here we do our projects we filter on what do we say submitted and we're still not getting this so let's go look at our code here got our time Leaf we've got our head here we go let's look at our errors so oh see so that's saying Project's bootstrap and so that maybe if we load it here we go to bootstrap he's in Project's bootstrap I don't think he's loading it right and [Music] so oh that may be it is and this is where we can run into some issues because what we've got here is it's trying to go with a uh it's trying to go off of this level instead of one level back when we do that uh when we load those values so if we go here um is it no I'm yeah it's projects so here this is within main I bet if we look at Main it is not going to get me my base oh actually I wonder if it's even if it lost the port and if we look and look here oh it did so it's a so it's there so if I do this let's do that see if I can do that and go look so he's not going to like that but he is he going to like that yes he is and so it's because it's built on top of this so we've got something a little bit we got to do here to make sure that we and this is something we run into on a fairly regular basis in apps of this sort is that when we run it uh right here it's actually not going back to the level it needs to be so we have to go to our main uh which is where did our man go where did our man go uh he is in let's see if I'm the right place yep and I think he was did we just call him header think we did yes and so here see we've got all of this stuff and it really needs to be probably like this so let's see if we pull just those uh let's see how that looks I think that'll get us there we're going to find out in a minute so we're going to come in here instead of building it off the core page oh see we got some issues here so it is complaining because oh it cannot parse as an expression so well that's why because I put that in the wrong place and that's probably okay so now let's try to run it and let's try this there we go okay and now if we get ourself going here and we go to projects so so far so good if we come in here oh look at that now we are able to actually see a project we're actually bringing stuff in because before we were having issues with our our slashes so now we've got our opportunities um I don't think we can click on that we have our projects at my admin doesn't exist so we go to projects and so now we should be able to filter there we go we can filter we can click and so our issue is uh making sure that when we do this stuff that we make sure we have a you know a root call to it so we should be able yeah from here we were able to test these so these were funny enough we had it here we just didn't have it whoops don't want to do that uh we didn't have it for a couple of our included files so let's just make sure uh we've got Link Link Link we've got our banner and that showed up up here and I think we had a problem before we were seeing Rush running into that we just didn't fix it and looks like we're good so now if we go to home then it's looking good we can click on this and now we can edit a project so now we've gotten a lot of our stuff back into place now we do oops one things we wanted to do is note that we did get our uh button straightened out a little bit there uh we do need to do so let's get from our project list let's just get that piece in and we wanted to go somewhere down here here we go because this buttons out on its own it is not a happy camper so what we're going to do is we're just going to take this create new button we're going to throw it in a div and actually we can just throw it in this huge div um yeah we'll just throw it in some well we're not going to go huge with it we'll just you know cut it to like six doesn't really matter because it's on it it's a essentially its own row and if we do that and then this is what our project list so we're going to come in and do that projects there now we got our button straightened out a little bit we still probably do some more stuff with them later but for now hey we have buttons and now we're going to go in here and you can see as we've seen before where we've got a lot of this stuff we can see leftover code so we want to go fix that first so let's take all of the uh C's here see like this this everywhere we've got an if we can take that and we're going to do a Time Leaf if and we're going to do a div and then we can just close the div and we don't need test equals uh so it's going to be if equals that so now we'll be able to see where this message is showing up that's going to get cleaned up and let's see what else we got we've got so we've got this our action is just going to be save project wh delete that and now cruising down through here let's see what else we got so we didn't have to worry about that one but we do have to worry about this uh what is that project report we're going to pull that thing wh we're going to pull him all the way in like that and oh that's project report so we'll just leave it like that and that gives us let's see so that's that one do we have a save and update yeah that one is right here and same thing I don't have to worry about that so we've got him split up start walking down here we do have our titles uh we've got our tasks here but now we have issues with that so what we need to do is our tried and true here we go uh that site is that what it was called oh that one looks like that came in twice okay so let's start with tasks because that's where we're at so we going to look at tasks so let's go find that there we go so in here we don't need to C if and but we do want it to be a loop so we do want uh that's just going to be a if and if project ID is greater than zero then it's going to come in here and we do a task submit so it may have some tasks and then for here remember we need to do a time and let's go back and look at the projects cuz I forget that one let me just copy that that's the easiest way to get my little Looper here we go that'll give me the whole kitten Kaboodle so if I come in here to this one so what we're going to want to do here is this is going to be call it task and Status it's going to be list of tasks and let's see so we want to select task and that's going to be task. ID oh oh interesting um I think that wants to be test. ID we I think that was a problem that we had there is that it was not working right before oh I see project ID so it's two things uh select task is going to be task ID and task. project ID so we've already got that little JavaScript built we don't need to worry about our our little status thing there and so we don't need to worry about this setting a status uh we don't need the 4 e each we don't need our on click because we've got that and then for each of these I think we're going to be good we're going to find out in a minute uh oh it's not going to be like that oh this going to be an interesting one right there because what we're going to have is uh t H text equals there we go and there is going to be th text equals and that's how we had it before right is we yep we had to close our date we don't have to put anything special in there and this one's going to be a text equals and we're just going to do we're not going to worry about the formatting the number right now and I did a underbar instead of a column and then this is going to be th text equals test name and same thing equals and we'll do the description so let's go ahead and get that and let's verify this one works and if it does then I think we will call it a wrap for this episode so we're going to come in we're going to do our projects um pick one and uh here we're seeing there's no tasks it gives us the header uh as we see here it's giving us a header because the project ID is greater than zero but this probably needs to be something that is a check to say hey if you know the number of if my tasks is list of tasks is greater than zero then I'm going to say that otherwise I'm going to say nothing found and so I do have something going here let's see do I have one that's got um I don't know if I've got any that have a task just oh here we go go here's one oh and we do it does look like we've got something if you look over here you can see where we did not close stuff up right somewhere so if we go here div div and a close oh that one doesn't have a close there we go so we can close that oh if I don't typo that then if we come in which project is that that was called project Administration okay and we know that we've got oh we've got a value in there let's go look at that real quick there is something up here on total hours where' it go where' it go all the way towards the top here we go total hours and so this needs to be probably a text equals we'll put him in there and we will put our bar here and our bar here and let's do this that close that bar and let's run it go check it out and what was that I think it was [Music] called uh oh it one that think was Plumbing reseller there we go so now we can see we've got our hours showing up we're seeing values basically in places here uh we're not getting our values coming up in our form up at the top uh it's probably may have something to do with that so that is going to be our next thing is let's make sure that we are getting values because these should be populated which if you look up here um like here we've got yeah see we're doing these old form inputs and so we're going to have to actually go back and we're going to pick those up so those are going to be rth texts and we will convert those next time around so thank you once again if you have any questions shoot us an email at info@ developer.com but go out there and have yourself a great day a great week we will come back next time and just keep chunking Along on this have a good one hello this is Rob with develop or also known as building better developers wanted to announce that we have school. developer.com feel free to check it out if you like any any of this information any of the content that we've sent and you would like to see more you can come out you can enroll for free we have free courses we've got places for you to get better at just learning a technology or howtos you can work on your business skills we can help you with becoming a better developer as in coding and things like that a lot of the stuff you've seen on YouTube we also have out at school. develop preneur we just have it in a little more of a uh educational format and a way for you to track your progress As you move forward becoming a better [Music] developer
Transcript Segments
[Music]
well hello and welcome back we are
continuing converting our little
application from Old School JSP to New
School spring Boot and we are sort of in
the middle of a little bit of a a
minseries within this series and we're
just working on like what we have is
some projects and we're working on
getting project list going and being
able to edit a project because we want
to be able to get in and turn this form
on and be able to actually edit
information now first we found last time
had a couple little things we want to
clean up a couple buttons and we want to
be able to filter so we want to be able
to come in here and say Hey I want
everybody that is
new
and I want let's say I want everybody
that is submitted or pending and if I do
that then I'm not getting what I want I
am getting that sent across I'm getting
projects with a but it is not it is
having an issue so let's take a look at
that
and let's see if we can get in if we're
getting an error so if we go to
new it tries
to and it was an unexpected
so uh oh let's see that was projects if
it goes
[Music]
here uh oops let's do
pending it is projects with a p so let's
go look here at
our uh we're going to look into our
controller because that's probably where
we need to go first so if we go find
projects right
here then one of the things that we have
is no we do not have our second
parameter uh in there at all so what we
would need is probably a second param we
can do a second one so we can do it with
and just leave that as is and then we
can say hey if we've
got this then we can add a parameter I
believe we have looked at that here
before adding that second yeah so we did
it like we did here and so we're going
to take something let's go look at this
very similar to what we did with edit
project so now if we do projects uh
second one there we go this is the
second
one and what we want to do is we're
going to send a
um let's call it a code which is our
it's going to be a onlet code and then
we're going to come in here and we're
going to make sure that we have a path
variable that will take that so we're
going to do our
request and we will do that I don't
think we need a local but that's okay
let's see what happens um if we do
our and he's going to be a string it's
actually going to be a character but
that's okay and we're going to call him
code and then here
and we're going to do list projects
let's see if we
have uh project
list and let's go see if we already have
that built by a type so if we go into
our Dao for our
projects let's just go to our Dao let's
see if we have something looks right so
we have this is based on
name here we go name and Status we have
the same thing with a name and a status
so that's going to be super easy because
that means that we will be able to call
this uh where do we call it list and
we're just going to do it and we're
going to add code to the
end and we don't need that we don't need
that and so let's see what happens now
oh let's um let's go back to this though
one of the things we were running into
is we've got these really nasty
buttons and let's make that button
primary button
primary and we are going
to I think we can leave them just as is
because I think we're going to be okay
so if we go nbsp we're going to put a
space on both
wh I'm put space on both sides of this
because I think it's going to be really
tight without it we could go in and mess
with the margins on our CSS we're not
going to do that right
now so let's see and that is do we want
those on a different row yeah we're
going to want those on a different row
so then we're going to come in
here and let's do this
wh
and well no we did not we wanted them on
potentially the same
row okay so let's put a space here
oh yeah let's put a space after that in
any case so even if we don't have a user
we'll have that now let's go take a look
at this stuff oh we also had another one
here we had this new project thing let's
make him
also a primary uh button
primary and let's go take a look at how
this all
looks so let's see if we got our filter
going plus cleaned up a couple of our
display issues so if we come in here and
we log
in
and we go to projects list oh I didn't
get that we did get it but they're
still spreading all the way
out so we will work on that in uh
momentarily because it is let's look at
this that's an
H5 that's in that
div so if it's there we want that in a
row so we probably want do I have one I
can just copy and paste real quick no so
I'm going to take
this
and let's see within here he's going to
do I call MD we'll call him an
11
and let's see if that gives me something
now the other thing we wanted to do is
whoops is we want to see if we can
filter so now did we get our filter
right so if we come into filter for
new there we go now interesting thing is
is it's getting us stuff but we have an
issue here is it's getting us to
apparently a different
page or it's breaking something so let's
go back and look at our hello hello
hello hello
controller and before we're doing
projects and now we're doing
projects which is a slightly different
list now we do see
um yeah see they're all if you look like
here you can see they're all new so
that's at least and oh and so we have
got something simple that we blew up
here so when it comes through oh it is
probably because the model is not set up
right did we have that before
um we did okay so we had lcal and
model and so I'm guessing that's going
to be a
problem we want him to be so he's
project oh that's our problem he's got
the same name uh projects
filter
so let's try
that looking
good didn't introduce something new come
up here we do our
projects we filter on what do we say
submitted and we're still not getting
this so let's go look at our code
here got our time Leaf we've got our
head here we go let's look at our errors
so oh see so that's saying Project's
bootstrap and so that
maybe if we load it
here
we go to bootstrap he's in Project's
bootstrap I don't think he's loading it
right and
[Music]
so oh that may be it
is and this is where we can run into
some issues because what we've got here
is it's trying to go with a uh it's
trying to go off of this level instead
of one level back when we do that uh
when we load those values so if we go
here um is it no I'm yeah it's
projects so here this is within main I
bet if we look at Main it is not going
to get me my
base oh actually I wonder if it's even
if it lost
the
port and if we look
and look here oh it did so it's a so
it's
there so if I do
this let's do that see if I can do
that and go
look so he's not going to like that but
he is he going to
like
that yes he is and so it's because it's
built on top of this so we've got
something a little bit we got to do here
to make sure that we and this is
something we run into on a fairly
regular basis in apps of this sort is
that when we run
it uh right here it's actually not going
back to the level it needs to be so we
have to go to our main uh which
is
where did our man go where did our man
go uh he is in let's see if I'm the
right place yep and I think he
was did we just call him
header think we did
yes and so
here see we've got all of this stuff and
it really needs to be probably
like this
so let's see if we pull just
those uh let's see how that looks I
think that'll get us there we're going
to find out in a minute so we're going
to come in
here instead of building it off the core
page oh see we got some issues
here so it is complaining because
oh it cannot parse as an
expression so well that's
why because I put that in the wrong
place and that's probably okay so now
let's try to run
it and let's try this there we go
okay and now if we get ourself going
here and we go to projects
so so far so good if we come in here oh
look at that now we are able to actually
see a project we're actually bringing
stuff in because before we were having
issues with our our slashes so now we've
got our opportunities um I don't think
we can click on that we have our
projects at my admin doesn't exist so we
go to projects and so now we should be
able to
filter there we go we can filter we can
click and so our issue is uh making sure
that when we do this stuff that we make
sure we have a you know a root call to
it so we should be able yeah from here
we were able to test these so these were
funny enough we had it here we just
didn't have it whoops don't want to do
that uh we didn't have it for a couple
of our included files so let's just make
sure uh we've got Link Link Link we've
got our banner and that showed up up
here and I think we had a problem before
we were seeing Rush running into that we
just didn't fix it and looks like we're
good so now if we go to
home then it's looking good we can click
on this and now we can edit a project so
now we've gotten a lot of our stuff back
into place now we do oops one things we
wanted to do is note that we did get our
uh button straightened out a little bit
there uh we do need to do so let's get
from our project list let's just get
that piece
in and we wanted to go somewhere down
here here we go because this buttons out
on its own it is not a happy camper so
what we're going to do is we're just
going to take this create new button
we're going to throw it in a div and
actually we can just throw it in this
huge div um yeah we'll just throw it in
some well we're not going to go huge
with it we'll just you know cut it to
like six doesn't really matter because
it's on it it's a essentially its own
row and if we do
that and then this is what our project
list so we're going to come in and do
that projects there now we got our
button straightened out a little bit we
still probably do some more stuff with
them later but for now hey we have
buttons and
now we're going to go in here and you
can see as we've seen before where we've
got a lot of this stuff we can see
leftover code so we want to go fix that
first so let's take all of the uh C's
here see like this this everywhere we've
got an if we can take that and we're
going to do a Time Leaf if and we're
going to do a
div and then we can just close the
div and we don't need test equals uh so
it's going to be if equals that so now
we'll be able to see where this message
is showing up that's going to get
cleaned
up and let's see what else we got we've
got so we've got this our action is just
going to be save
project
wh delete that and now cruising down
through here let's see what else we got
so we didn't have to worry about that
one but we do have to worry about this
uh what is that project report we're
going to pull that thing wh
we're going to pull him all the way in
like that
and oh that's project report so we'll
just leave it like
that and that gives us let's see so
that's that one do we have a save and
update yeah that one is right here and
same thing I don't have to worry about
that so we've got him split up start
walking down here we do have our titles
uh we've got our tasks here but now we
have issues with that so what we need to
do is our tried and true here we
go uh that site is that what it was
called oh that one looks like that came
in twice okay so let's start with
tasks because that's where we're at so
we going to look at tasks so let's go
find
that there we go so in here we don't
need to C
if and but we do want it to be a loop so
we do
want uh that's just going to be
a
if and if project ID is greater than
zero then it's going to come in here and
we do a task
submit so it may have some tasks and
then for here
remember we need to do a time and let's
go back and look at the projects cuz I
forget that one let me just copy that
that's the easiest way to get my little
Looper here we
go that'll give me the whole kitten
Kaboodle so if I come in here to this
one so what we're going to want to do
here is this is going to
be call it task and Status it's going to
be list of
tasks and let's see so we want to select
task and that's going to be task. ID
oh oh interesting
um I think that wants to be test.
ID we I think that was a problem that we
had there is that it was not working
right before oh I see project ID so it's
two
things uh select task is going to be
task
ID
and task. project
ID so we've already got that little
JavaScript
built we don't need to worry about
our our little status thing
there and so we don't need to worry
about this setting a
status uh we don't need the 4 e
each we don't need our on click because
we've got
that and then for each of
these I think we're going to be good
we're going to find out in a minute uh
oh it's not going to
be like
that oh this going to be an interesting
one right there because what we're going
to have
is uh t H text
equals there we
go and there is going to
be
th text
equals and that's how we had it before
right is we yep we had to close our date
we don't have to put anything special in
there and this one's going to be
a text equals and we're just going to do
we're not going to worry about the
formatting the number right
now and I did a underbar instead of a
column and then this is going to be th
text equals test
name and same
thing equals
and we'll do the
description so let's go ahead and get
that and let's verify this one
works and if it
does then I think we will call it a wrap
for this episode so we're going to come
in we're going to do our projects um
pick one and uh here we're seeing
there's no tasks it gives us the header
uh as we see
here it's giving us a header because the
project ID is greater than zero but this
probably needs to be something that is a
check to say hey if you know the number
of if my tasks is list of tasks is
greater than zero then I'm going to say
that otherwise I'm going to say nothing
found and so I do have something going
here let's see do I have one that's
got um I don't know if I've got any that
have a
task just oh here we go go here's one oh
and we do it does look like we've got
something if you look over here you can
see where we did not close stuff up
right
somewhere so if we go
here div div and a close oh that one
doesn't have a close there we go so we
can close that
oh if I don't typo that then if we come
in which project is that that was called
project Administration okay and we know
that we've got oh we've got a value in
there let's go look at that real quick
there is something up here on total
hours where' it go where' it go all the
way towards the top here we go total
hours and so this needs to
be probably a
text
equals we'll put him in
there and we will put our bar
here and our bar
here
and let's do this that close that bar
and let's run
it go check it
out and what was that I think it was
[Music]
called uh oh it one that think was
Plumbing reseller there we go so now we
can see we've got our hours showing up
we're seeing values basically in places
here uh we're not getting our values
coming up in our form up at the top uh
it's probably may have something to do
with that so that is going to be our
next thing is let's make sure that we
are getting values because these should
be populated which if you look up
here um like here we've got yeah see
we're doing these old form inputs and so
we're going to have to actually go back
and we're going to pick those up so
those are going to be rth texts and we
will convert those next time around so
thank you once again if you have any
questions shoot us an email at info@
developer.com but go out there and have
yourself a great day a great week we
will come back next time and just keep
chunking Along on this have a good one
hello this is Rob with develop or also
known as building better developers
wanted to announce that we have school.
developer.com feel free to check it out
if you like any any of this information
any of the content that we've sent and
you would like to see more you can come
out you can enroll for free we have free
courses we've got places for you to get
better at just learning a technology or
howtos you can work on your business
skills we can help you with becoming a
better developer as in coding and things
like that a lot of the stuff you've seen
on YouTube we also have out at school.
develop preneur we just have it in a
little more of a uh educational format
and a way for you to track your progress
As you move forward becoming a better
[Music]
developer