Using the onPropertyChange Property : RadioButton Radio « Form Control « JavaScript DHTML






Using the onPropertyChange Property

  


/*
JavaScript Bible, Fourth Edition
by Danny Goodman 

John Wiley & Sons CopyRight 2001
*/


<HTML>
<HEAD>
<TITLE>onPropertyChange Event Handler</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function normalText() {
    myP.innerText = "This is a sample paragraph."
}
function shortText() {
    myP.innerText = "Short stuff."
}
function normalColor() {
    myP.style.color = "black"
}
function hotColor() {
    myP.style.color = "red"
}

function showChange() {
    var objID = event.srcElement.id
    var propName = event.propertyName
    var newValue = eval(objID + "." + propName)
    status = "The " + propName + " property of the " + objID
    status += " object has changed to \"" + newValue + "\"."
}
</SCRIPT>
</HEAD>
<BODY>
<H1>onPropertyChange Event Handler</H1>
<HR>
<P ID="myP" onPropertyChange = "showChange()">This is a sample paragraph.</P>
<FORM>
Text: <INPUT TYPE="radio" NAME="btn1" CHECKED onClick="normalText()">Normal
      <INPUT TYPE="radio" NAME="btn1" onClick="shortText()">Short
<BR>
Color: <INPUT TYPE="radio" NAME="btn2" CHECKED onClick="normalColor()">Black
       <INPUT TYPE="radio" NAME="btn2" onClick="hotColor()">Red
</FORM>
</BODY>
</HTML>
           
         
    
  








Related examples in the same category

1.'defaultChecked' Example
2.Radio Button status Example
3.Check a Radio Button
4.Radio buttons in a form
5.Radio action
6.Methods and Properties of the Radio Object
7.Determining the Value of the Selected Radio Button
8.Scripting a Group of Radio Objects
9.Finding the Selected Button in a Radio Group
10.An onClick event Handler for Radio Buttons
11.Get the radio button selection
12.Get the select radio button and its value
13.Cycle the selected radio buttons