web developer test

[Nasir89]

Please have a look to my homework and let me know if there is anything need fix ,
thanks

[zero-point]

Here is some feedback, let me know if you have any questions:

1. Build the page in the image attached using valid HTML/CSS

Almost finished this part, the website looks mostly as it should. Just need to use italics for "Clich here to download a PDF of our recent work".

2. Show/Hide news Item

Lacking this part. Needs "Show/Hide news" item functionality, so that when the user clicks on it the news items disappear/ appear. Currently, you have two span elements within the showHideHeader element, this isn't neccesary. You just have to add an click event listener for the showHideHeader element that will toggle the dynamicnews element (hide it when it's present and show it when it's not).

3. ’More Information’ form

Looks pretty good, you do some validation checks but you need a bit more for the email address check (like checking whether there is an "@" in the email provided).

Also, in the instructions it says that the field ‘Contact phone number’ is not required. So the form should work if no phone number is provided. But you need to add a check when a phone number is provided, that it contains only digits and be a maximum of 11 characters long upon submission.

I also recommend using a better name for the function (rather than doSomething).

4. Populating news with an AJAX call

Looking good!

Irina :)

[zero-point]

Forgot to mention that you can improve the website by preventing the browser refreshing the page every time a form is submitted.

In your function that handles clicks on the Submit button you will need to call event.preventDefault() to stop the browser from refreshing the page. To read more on how to do this: https://developer.mozilla.org/en/docs/Web/API/Event/preventDefault

Irina :)

[zero-point]

Looking better! Just a couple of suggestions:

• when making a header clickable (hyperlink) it's good practice to have the entire text clickable rather than just a section (for example 'Show/Hide news item' should be clickable rather than just 'Show/hide', same for 'Click here ...')

• event.preventDefault() in the hide/show code is unnecessary, however it would be useful in the doSomething function

• bad function name: doSomething

• the form fields should be emptied after the user clicks the submit button

Hope that helps!

Irina :)