- The creation of a function in the script section of the page
- The calling of a function from the action button
- The declaration and use of a variable
- Identifying an element on the page to obtain data from it
- The use of selection – if…else…
- The use of an alert box
You should give your students Password.html and hiddenPage.html in the download below. On the first file, there is a command button to load the second page. There is also an input box where a password needs to be entered. When the correct password is entered and the ‘Submit’ button is pressed then hiddenPage.html will load. If the password is incorrect, an alert box will tell the user that the password is incorrect, and the input box will be cleared.
Students will need to open Password.html in a suitable IDE or text editor and familiarise themselves with the HTML. They should note the id of the input box and action button especially. Students need to add a function that is called when the button is pressed. They can decide to type their own password or simply type ‘password’.
A solution is shown in Password_Solution.html.
- In the solution given, hiddenPage.html opens in the same window as Password.html.
Students could change the code to load this page so that it loads in a new window.
Answer: Delete the ‘_self’ switch.
- Edit the HTML code so that when the password is entered, the letters are not shown, only asterisks. Answer: Change the ‘type’ of the input box from ‘text’ to ‘password’.
New to in Cambridge International AS & A Level IT? Read David’s top tips on transitioning from Cambridge International IGCSE ICT.