Lesson 16

Practical Application 1 We can take advantage of JavaScript and the DOM, to set up a form so that the first text box of a form automatically has focus (i.e. the user can begin typing in that box without clicking on it first). This is a convenience to the many users who use the keyboard to navigate through forms.

Practical Application 1 In order to affect an element on the page, we must first be able to name it. We use the name attribute of the form tag to give a name to the form that contains the element that will be in focus when the page loads. We already have given a name to the text box. Once we can refer to the text box, we can call the built-in function called focus().

Practical Application <!-- Hide from old browsers 7// 8document.focusDemo. userName.focus(); 9// --> 10

Radio Buttons We use the DOM to reference the field in question by name. If the form is named “mailingList”, and a group of radio buttons has the name “music”, then the group of radio buttons would be referenced by the name document.mailingList.music

Radio Buttons Since we are dealing with a group of elements with the same name, the DOM provides us with an array representing all the items with the same name attribute. We use standard array notation [ x ], where x represents the number of the desired element, starting with 0 for the first element.

Radio Buttons For example, if we have the following code, rock disco house The first radio button (value=“rock”) is referred to as document.mailingList.music[0] The next one (value=“disco”) is referred to by the name document.mailingList.music[1] The next one (value=“house”) is referred to by the name document.mailingList.music[2]

checked We use the property “checked” to see if a particular radio button has been clicked. “checked” will have a boolean value true or false. The following example tests to see if the first button in the previous code example (“rock”) is checked; if (document.mailingList.music[0].checked) { // do something }

value We use the property “value” to obtain the contents of the value attribute of a given radio button. The following example tests to see if the value of the first button in the previous code example is “rock”; if (document.mailingList.music[0].value = = “rock”) { // do something }

Review A function is invoked with a ________________ function call A variable known only within the function in which it is defined is called _________________ Local variable

Review The _____________ statement in a called function can be used to pass the value of an expression back to the calling function return a) Method g() { document.writeln( “inside method g” ); } b) function sum( x, y ) { var result; result = x + y } c) Function f( a ); { document.writeln( a ); } a) Method  function b)return x + y c) remove ;