Dynamicly change SelectOneRadio value in java script function -- Please hel
Hello, I need to change SelectOneRadio value within a javascript function. But it doesn't seem to work for me. Can someone tall me what I did wrong or how to get this?
Thanks a lot!
I have :
<h:panelGrid Columns="3">
<h:selectOneRadio id="myRadio", value="#{myBean.radioOption}" />
<f:selectItems value="#{myBean.radioOptionList}" />
</h:selectOneRadio>
</h:panelGrid>
<script >
function needToChangeRadioValue(choice){
if ( choice == something ) {
document.getElementById("myForm:myRadio").value="1"; //doesn't really work
document.getElementById("myForm:myRadio").immediate="true";
} else if ( choice == somethingelse ) {
document.getElementById("myForm:myRadio").value="2"; //doesn't really work
document.getElementById("myForm:myRadio").immediate="true";
} else {
document.getElementById("myForm:myRadio").value="3"; //doesn't really work
document.getElementById("myForm:myRadio").immediate="true";
}
}
</script>
-- java --
ArrayList radioOptionList;
public ArrayList getRadioOptionList(){
radioOptionList = new ArrayList();
radioOptionList.put("1","Option1");
radioOptionList.put("2","Option2");
radioOptionList.put("3","Option3");
return radioOptionList;
}
[1409 byte] By [
Tinaia] at [2007-10-3 0:24:58]
Thank you for response. But I don't have portlet. Instead I am using simple JSF with .jsp suffix.
I tryed using getElementByName("myForm:myRadio").value = "1" and getElementByName("myForm:myRadio")[1].value ="1". They all get javascript error.
The interest thing is when I put "showmetheoption()" method when click on it. It shows me that the radio choice(value) is "1" which I set it earlier. Furthermore, when I click on other options, other than Option1, I suppose to see "you selected : 2" or "you selected: 3". But instead I keep seeing " you selected: 1"!!!?. On the screen I saw Option2 or Option3 was selected.
It looks like to me that that element value is indeed set up to "1" but from screen it doesn't show that Option1 is selected as it should be.
I hope the information I gave doesn't confuse you more. I desperate need help and have no where to go.
function showmetheoption(){
alert(" you selected : " + document.getElementById("myForm:myRadio").value );
}
<h:panelGrid Columns="3">
<h:selectOneRadio id="myRadio", value="#{myBean.radioOption}" onclick="showmetheoption()" />
<f:selectItems value="#{myBean.radioOptionList}" />
</h:selectOneRadio>
</h:panelGrid>
Tinaia at 2007-7-14 17:17:18 >
Thank you for the quick response!
Does it work for you? I tryed getElementsByName("myform:myRadio")[1].value="1"; No errors but the screen doesn't show that radio button is "on". I also created another function to go through the form object and try to set the attribute but no luck. From screen, I still don't see the option is selected(or on). I have :
<script .... >
function checkRadioButton(){
var allElem = document.forms['myform'].elements;
for ( i=0 ; i< allElem.length; i++ ){
alert("element name = " + allElem.name );// I see myform:myRadio three times
alert("element id = " + allElem.id )// when name="myform:myRadio, id is null/empty
alert("element value = "+ allElem.value );// when name="myform:myRadio, value = 1, 2, 3 respectively
if ( allElem.name == 'myform.myRadio' ) {
var attributes = allElem.attributes;
for ( j =0; j < attributes.length; j++) {
if ( attributes[j].name == 'CHECKED' ) { // I found CHECKED is one of selectOneRadio's attributes
if ( i == 1) {
attributes[j].value = true; // It still doesn't work. I didn't see that option1 get selected/on.
}
}
}
}
}
What I am trying to do is common, I think !!? Really appreciate your help.
Tinaia at 2007-7-14 17:17:18 >
