hi,
I am facing a
js error in my code, below is the prob. statement
I have a radio2 javascript function as below, it works like this..
When a parent radio button is selected only one of its child radio button can be selected and on selection of a new child button(of the same parent) the earlier child button is deselected.
When i navigate to this particular page and select a parent and select a child, when i select another child of the same parent the radio is selected( this should not have been the behaviour) and the below error is displayed:
form.elements[...].checked is null or not an object.
The
js pop-up says the below line is the error(line marked in bold in source code):
thisObj.form.elements[parentRadioButtonName].checked=true;
My javascript code:
------------------
Code:
function sL_radio2_onclick(thisObj, thisEvent) {
//use 'thisObj' to refer directly to this component instead of keyword 'this'
//use 'thisEvent' to refer to the event generated instead of keyword 'event'
// find the parent array number
var indexStart = eval("form1:table1:".length);
var indexEnd = thisObj.name.indexOf(':table2');
var parentIndex = thisObj.name.substring(indexStart,indexEnd);
// check the parent if child is checked and parent is not checked before
parentRadioButtonName = 'form1:table1:'+parentIndex+':radio1';
if (thisObj.checked && (!thisObj.form.elements[parentRadioButtonName].checked)) {
thisObj.form.elements[parentRadioButtonName].checked=true;
//uncheck other parent
for(i=0;1==1;i++){
parentRadioButtonName = 'form1:table1:'+i+':radio1';
if (thisObj.form.elements[parentRadioButtonName]) {
//if this parent is checked and not the parent of current child
if(thisObj.form.elements[parentRadioButtonName].checked && (i != parentIndex)){
thisObj.form.elements[parentRadioButtonName].checked=false;
//uncheck children of this parent
for(j=0;1==1;j++){
childRadioButtonName = 'form1:table1:'+i+':table2:'+j+':radio2';
if(thisObj.form.elements[childRadioButtonName]){
thisObj.form.elements[childRadioButtonName].checked=false;
} else {
break;
}
}
}
} else {
if (i>parentIndex) {
break;
}
}
}
}
//if this child is checked, uncheck other children
// which has same parent as this child
if (thisObj.checked) {
for(i=0;1==1;i++){
childRadioButtonName = 'form1:table1:'+parentIndex+':table2:'+i+':radio2';
if(thisObj.form.elements[childRadioButtonName]){
//check this child is not itself
if (!(thisObj.form.elements[childRadioButtonName]==thisObj)) {
thisObj.form.elements[childRadioButtonName].checked=false;
}
} else {
break;
}
}
}
}
JSP call:
-------
Code:
<h:selectOneRadio styleClass="selectOneRadio" id="radio2"
value="#{pc_SL.objectSpace.sPd}"
onclick="return sL_radio2_onclick(this, event);">
<f:selectItem
itemValue="#{varBObj.OrgBObj.sSId}"
itemLabel=" " />
</h:selectOneRadio>
The problem lies in this line
Code:
if (thisObj.checked && (!thisObj.form.elements[parentRadioButtonName].checked)) {
...
}
When i debugged with IE debugger it shows the below values for the above statement:
thisObj.checked = true
(!thisObj.form.elements[parentRadioButtonName].checked) = error
Hope i was able to explain properly.
Thanks in advance.
P.N:
How my radio buttons should work with above code is:
----------------------------
I have radio buttons corresponding to some id's retrieved from database.
Next each parent radio button has several child buttons(retrieved from database).
When i select a parent button only one child button has to be selected and when i move from one child to another child radio button belonging to the same parent the previous child radio has to be de-selected automatically and next clicked radio to be selected.
When i select a parent radio only one parent radio has to be selected and when i move to another parent radio the previous parent has to be deselected and new parent radio selected.
P.N: The no. of radio's in a list depends on the database.
Javascript error: form.elements[...].....
