Need bigtime help with Radio button events (onBlur, onChange)

[JSchwarz]

I have some very simple JavaScript code which I want to execute whenever the user clicks a different radio button (from a set of three). However, the code seems to execute "one behind" whatever the user is doing (does that make sense?).

OK, here's one of my attempts:<INPUT TYPE=radio NAME="isPriceFactor" TABINDEX=37 VALUE="1" onChange="
getRatingInfo(getVal("isPriceFactor"));
">Price factor<BR>

<INPUT TYPE=radio NAME="isPriceFactor" TABINDEX=37 VALUE="2" onChange="
getRatingInfo(getVal("isPriceFactor"));
">Past Performance factor<BR>

<INPUT TYPE=radio NAME="isPriceFactor" TABINDEX=37 VALUE="0" CHECKED onChange="
getRatingInfo(getVal("isPriceFactor"));
">Neither

But the value of "isPriceFactor" always seems to be the *previously* checked value. That is, if isPriceFactor has value "Neither" checked, and the user clicks on "Price factor", then getVal("isPriceFactor") returns 0 -- the previous value (not the one the user just ckeched, which would be 1).

As you can see, I'm using the onChange event, but I've also tried the onBlur event.

Also, I need this to work for both IE and NN4 and for mouse and keyboard navigation.

Here is the (relevant) code for getVal(). I know this looks like a lot of code, but it's really simple <G>.

Thanks in advance if anyone can help.
Jeff

[CODE]function getVal(strFld) {
switch (type=getType(strFld)) {
case "hidden":
case "text":
case "textarea":
val = fld.value;
break;

case "select-one":
val = fld.options[fld.selectedIndex].value;
break;

case "select-multiple":
case "checkbox":
alert("Lazy programmer alert: Did not implement getFieldVal for " + type + " fields (yet).");
return;
break;

case "radio":
return isRadioChecked(fld);
break;

default:
alert("Stupid programmer alert: Has not heard of " + fld.type + " type fields");
return;
break;
} // switch (type=getType(strFld))

return val;
} // function getVal()

function getType(elName) {
for (var x=0; x<thisForm.length; x++) {
if (thisForm[x].name == elName) {
el = thisForm[x];
break;
}
} // for (var x=0; x<frm.length; x++)
return el.type;
}

function isRadioChecked(fld) {
// Returns false if fld -- a radio button field -- has no options checked, otherwise it returns the value of the checked option.
for (var i=0; i<fld.length; i++) {
if (fld[i].checked) return fld[i].value;
}
return false;
} // function isChecked(fld)

[Khalid Ali]

There is a significant number of errors in the code,can you describe what exactly is you are trying to do.I can probably write few lines for you.

[couchmonkey]

Stepping out on a limb since I haven't used these that much, but onclick() or onfocus() may give you the effect you're looking for.

I believe onfocus() should work like the opposite of onblur() - that is, onblur() takes effect after the radio button stops being the "active" portion of the form and onfocus() takes effect after the radio button starts being the active portion of the form.

[JSchwarz]

I'm trying to lookup some values on the server based on which radio box is selected. Here is my current code:

Radio field isPriceFactor, onChange calls getRatingInfo() (and that's all).

Function getRatingInfo() needs the value of isPriceFactor (or which button is checked); it starts like this (you only need worry about the second line, really): // If other (ValueNotInList) is blank, use value from Factor field, else use other.
var strFactor = ((other = trim(getVal("ValueNotInList"))) ? other : getVal("Factor"));
var isPrice = getVal('isPriceFactor');


But the second line returns the *previous* value of isPriceFactor.

The full getVal function is:function isRadioChecked(fld) {
for (var i=0; i<fld.length; i++) {
if (fld[i].checked) return fld[i].value;
}
return false;
} // function isRadioChecked(fld)


function getType(elName) {
//Khalid, you may recognize this -- you wrote it
var el;

if (typeof elName != "string") elName = elName.name;

for (var x=0; x<thisForm.length; x++) {
if (thisForm[x].name == elName) {
el = thisForm[x];
break;
}
} // for (var x=0; x<frm.length; x++)

return el.type;
}


function getVal(strFld) {
// Returns the value of field of any type (eventually, I hope), for any browser (eventually, I hope).
// The field can be passed in as a string or field reference (except radio buttons which I can't get getType() working when strFld is a radio button reference)..
var fld;
var val;

// Caller must have a value.
if (!strFld) {
alert("Function getVal() supplied with invalid reference:\t" + strFld);
return;
} // if (!strFld)

// Get object reference to the field (excuse me that's, "input element").
if (typeof strFld == "string") fld = thisForm[strFld];
else fld = strFld;

if (!fld) {
alert("Can not locate field:\t" + strFld);
return;
}

switch (type=getType(strFld)) {
case "hidden":
case "text":
case "textarea":
val = fld.value;
break;

case "select-one":
val = fld.options[fld.selectedIndex].value;
break;

case "select-multiple":
case "checkbox":
alert("Lazy programmer alert: Did not implement getFieldVal for " + type + " fields (yet).");
return;
break;

case "radio":
return isRadioChecked(fld);
break;

default:
alert("Stupid programmer alert: Has not heard of " + fld.type + " type fields");
return;
break;
} // switch (type=getType(strFld))

//alert('getVal=\t'+val+'\t'+type);
return val;
} // function getVal()

[Khalid Ali]

So in simplest terms you need to pass
the currently checked radio buttons value to
getRatingInfo()
function? at any given time right?

[JSchwarz]

That's exactly what I'm trying to do.

[Khalid Ali]

Here is an extremely simplified approach,and to implement it in a way tha you wre trying earlier will be immensely easy.

<script type="text/javascript">
<!--
function getVal(fld) {
return (fld.checked)?fld.value:alert("Stupid programmer alert: Has not heard of " + fld.type + " type fields");
} // function getVal()

function getRatingInfo(val){
alert("field value = " + val)
}
//-->
</script>
</head>

<body class="body">

<form id="form1" action="" onsubmit="">
<INPUT TYPE=radio NAME="isPriceFactor" TABINDEX=37 VALUE="1"
onclick="getRatingInfo(getVal(this));">Price factor<BR>

<INPUT TYPE=radio NAME="isPriceFactor" TABINDEX=37 VALUE="2"
onclick="getRatingInfo(getVal(this));">Past Performance factor<BR>

<INPUT TYPE=radio NAME="isPriceFactor" TABINDEX=37 VALUE="0" CHECKED
onclick="getRatingInfo(getVal(this));">Neither
</form>

[JSchwarz]

OK, that works the way I'd expect. It also works for keyboard events (which I didn't expect).

Thanks.

[Khalid Ali]

you are welcome..:D