JavaScript Practice | Day 5

Posted in Career Success, Practice Tagged: , , , , , , ,
Picture of Day 5 Form - JavaScript Practice

I probably should have chosen an easier project to use for the starts of these days, as I know it isn’t very exciting to not have anything at the end of the day. Especially since my blog is new, I can’t tell you to finish on your own and then come back when I’m finish, cause I may never see you again. All notes taken for future endeavors because today is similar to yesterday in that we’re not finished with our project. I could spend the morning grinding it out, but I’ve made some good notes and I think I’ll wait to finish till tomorrow. I have to make my static homepage @ TysonHood.com a full, dynamic WordPress site today, so you (theoretical readers) and this blog can start being real!

Anywho… The Input Form

Today was a day for pseudo code and testing the waters. As you can see by the picture below, not a whole lot has changed. I started making the button functionality, but didn’t have any buttons, so I spent some time making a form. The form is just a basic set up with no real purpose, if this were a real case, but it works for what we’re trying to do. We’ll have our First Name, Last Name, Email, and Message as live inputs. Right now, I have a div at the top, with a span of what will be the ID. Though, this may turn into an non-editable input, depending on how easily it is to populate/get the ID.

The logic to this form goes like this: The very first thing will be to check if there’s an ID populated. Why? Because the only way an ID is getting populated, is if we just populated it with an old users info from the search function. If the ID is populated, then we can write some logic to save the information over the current values of that user’s object (in case they changed something). We’ll then push the updated object back into the array where the old one was and display a message regarding success.

If the ID field is not populated, then we will be creating a new object for the user. We will use Math.random and some other Math functions to generate a random ID for the user. Then, we’re going to get the information from the input fields and create a new object with this and the ID number. We’ll then push that object into the end of the array and display a friendly message regarding success.

Sounds easy, right? Hopefully.

Picture of Day 5 Form

The Search Form

The second form is what we’re going to be using for the information retrieval. It’s basically a one input form because how many do you really need to search for an id. When the user searches for their unique ID, we’re going to have to loop through the array searching for when the number they entered matches an unique ID within and object the array at i. Then, we’ll populate the top form with their data (I feel this makes more sense than creating a whole new form, for right now). This will take us back to the above point of having filled in the unique ID and not creating a new user object.

As of right now, I’m not figuring out how to display an error message (such as, “ID not recognized”). Using an else statement within the loop, I get both the object and the error message printed to the console. I just, right this very second as I was typing, figured out this is because our array only has two objects. Meaning, if it recognizes the number, it will populate the fields, but then also move on and print the message, because it doesn’t match the number for the second object. So we’ll have to stop the loop if the ID matches another. Also, if the ID doesn’t match any of the object’s ID’s, it will continuously print the error message for each object in the array. I would like to get this to print only once.

JavaScript Code for Day 5

Results for Section Two

All This in One Day??

Typing this all out really makes me think we’re (I’m) not going to finish this tomorrow. I’m not really sure how to update an object in an array and the error message thing is a little frustrating. If nothing else, we can extend it another day and maybe do a mini-project to make up for it… Or not and just fill the space with a game of LoL (anyone need a hyper-carry-support?). I’ve committed my work for the day and am off to the races on the site. Until next time, you all have a wonderful day.

Thank you much!

Written by Tyson Hood

Leave a Reply

Your email address will not be published. Required fields are marked *

Like what you see and want more info?

Click below to get on the mailing list.

Yes, send me some info!