I thought it would be easy doing this unit due to the fact I had a good understanding in programming, but it seems when things relate together through html, CSS and JavaScript. It can become more complicated to find solution and debugging the problems.

I tackled this unit by trying to implement a code for gathering the data from the form in my contact page.  I made variables using let for the name, email and message ( textarea ). Then I created a function called theForm() with if statements to check for equality: if the name variable is empty display a message. Same thing for each field…

Then I put the name, email and message in an array and return the array.

The idea was to bring the data from array to wherever I can bring it when I would get an api or send it to a server.

I went through w3schools tutorials and tried the form validation method in the js form part.

There are multiple errors in my code that I wish I could debug. At first I tried to use the addEventListener to call using my form element id in the DOM but it would return an error on the browser tool and I was not able to find it. Then I found out about the form validation and that is what I was aiming for. Once the validation done through verifying that every fields are not empty. I could then take the value of the name, email and message and return them into an array.

 For my variables I have an error. The variables are null but once I input them in the form and click the submit I get an error that variables cannot be found before initialization.

 I have yet to find this error in my browser or code.

I did not meet my persona requirements here but I did learn a lot in javascript. I just could not go through my form data submission problem. This is a lesson on humility. I was confident that because I knew Java, this would be a piece of cake.

The tutorials in w3schools are good but for some reason my code doesn’t seem to relate well with the html page. Although it is straightforward. I will be figuring this out pretty soon as I do not let things go.

I started my code with variable declaration using getElemenById() in order to set the variables to the value in my id’s elements. Then added a variable for displaying error messages and implemented a div with errors id in html for later use in my validation of the email form.

I added a button variable set to the button id in my form page when trying to create a message in my debugger in the browser developer tool.

I made a function called theForm() that checks for equality with each fields in the form and the I made the variables into an array. The array is return as value. Later with an api and jquery the email form can be sent using a server. I was using the alert() function to test the variables initialization because there was an error in my variable initialization when submitting the form.

At a certain point I went on and created a class with a constructor and getters for the name. email and message but realized this syntactic sugar was maybe overkill for what I was trying to do.