dreamchaser23
asked on
How to add an item to a checkboxlist in Javascript?
Hi all,
Scenario: If there is a dropdownbox having the three values: "Add, Subtract, Multiply" and there is a Checkboxlist with the same 3 values. If the user selects "Add" option in the dropdownlist, then the item "Add" in the Checkboxlist will be removed by the below code. If the user selects "Subtract" option in the dropdownlist, then "Add" item should be added to the checkboxlist and "Subtract" item needs to be removed.
I am not able to add the item back to the checkboxlist.
If I use the following code, I would be able to remove Checkboxlist item whose value is equal to the value selected in the DropDownList:
var chkObj = document.getElementById('C heckBoxLis t1').child Nodes[0];
var dropDownListObject = document.getElementById('H TMLDropDow nList1');
var dropDownListSelectedValue = dropDownListObject.options [dropDownL istObject. selectedIn dex].value ;
for (i=0;i<chkObj.childNodes.l ength;i++)
{
if(chkObj.childNodes[i].in nerText==d ropDownLis tSelectedV alue)
{
chkObj.removeChild(chkObj. childNodes [i]);
// chkObj.childNodes[i].appen dChild();
// I tried appendChild, however it is not working.
}
I would like to know how to add the item back to the Checkboxlist?
Any help would be greatly appreciated.
Many thanks,
DreamChaser
Scenario: If there is a dropdownbox having the three values: "Add, Subtract, Multiply" and there is a Checkboxlist with the same 3 values. If the user selects "Add" option in the dropdownlist, then the item "Add" in the Checkboxlist will be removed by the below code. If the user selects "Subtract" option in the dropdownlist, then "Add" item should be added to the checkboxlist and "Subtract" item needs to be removed.
I am not able to add the item back to the checkboxlist.
If I use the following code, I would be able to remove Checkboxlist item whose value is equal to the value selected in the DropDownList:
var chkObj = document.getElementById('C
var dropDownListObject = document.getElementById('H
var dropDownListSelectedValue = dropDownListObject.options
for (i=0;i<chkObj.childNodes.l
{
if(chkObj.childNodes[i].in
{
chkObj.removeChild(chkObj.
// chkObj.childNodes[i].appen
// I tried appendChild, however it is not working.
}
I would like to know how to add the item back to the Checkboxlist?
Any help would be greatly appreciated.
Many thanks,
DreamChaser
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Hi Suraj, Thanks a lot for your comment.
I got this error message:
"Sys is not defined". and the value doesnt get added.
Could you please let me know why?
I got this error message:
"Sys is not defined". and the value doesnt get added.
Could you please let me know why?
>> "Sys is not defined".
I dont remember the word SYS being anywhere in the code i pasted. Am i missing something?.
I dont remember the word SYS being anywhere in the code i pasted. Am i missing something?.
ASKER
This "Sys is not defined" error, I get in page load itself.
If I try to change an option in the dropdownlist, I get "Method not supported" (I think Add method).
Thanks again for your reply.
If I try to change an option in the dropdownlist, I get "Method not supported" (I think Add method).
Thanks again for your reply.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks Suraj for your reply again.
yeah, I tried again
I got this error message "Object does not support the property or method" at this line:
chkObj.childNodes.Add(chkb ox);
yeah, I tried again
I got this error message "Object does not support the property or method" at this line:
chkObj.childNodes.Add(chkb
ASKER
Hi gops1,
Many thanks for your reply.
Obviously your code works 100%. :) Thanks for that as well..
But according to the specs (& my Manager), I gotta use checkboxlist only :(
I spent a great deal of time to make it work so far. :)
It would be great if I am able to add the checkboxlist item in JS.
Could you pls throw some light on this...
Thanks again for your comment, gops1.
Many thanks for your reply.
Obviously your code works 100%. :) Thanks for that as well..
But according to the specs (& my Manager), I gotta use checkboxlist only :(
I spent a great deal of time to make it work so far. :)
It would be great if I am able to add the checkboxlist item in JS.
Could you pls throw some light on this...
Thanks again for your comment, gops1.
Can you try chkObj.elements.add(chkbox ) ??
ASKER
Thanks yet again, mate.
I get this mesg now: 'elements' is null or not an object
I get this mesg now: 'elements' is null or not an object
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Hi Gops1,
Thank you so much for the second solution.
Could you let me know the differences between this and the first one.
Obviously the first one seemed a lot easier.
Will the second one be better than the other one?
Sorry for the delay. Thanks again.
DreamChaser
Thank you so much for the second solution.
Could you let me know the differences between this and the first one.
Obviously the first one seemed a lot easier.
Will the second one be better than the other one?
Sorry for the delay. Thanks again.
DreamChaser
ASKER
Hi Suraj
Thanks a lot for the code.
It is indeed working.
I'll try to play around for my scenario.
Thanks again for your help mate
DreamChaser
Thanks a lot for the code.
It is indeed working.
I'll try to play around for my scenario.
Thanks again for your help mate
DreamChaser
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks a lot mate!!!
Really clear.. understood well.
Thanks again.
I have a quick question: In this same scenario, assume that the user selected "Add" option, and add option in the checkboxes gets removed according to your first code. Now if the user clicks on Refresh button, the "Add" checkbox also gets displayed in the page. Is this correct in the real world when the user clicks on Refresh button? Or should the option selected by the user should be maintained? Please let me know as and when you find time.
Thanks a lot again for the crisp explanation.!!
Really clear.. understood well.
Thanks again.
I have a quick question: In this same scenario, assume that the user selected "Add" option, and add option in the checkboxes gets removed according to your first code. Now if the user clicks on Refresh button, the "Add" checkbox also gets displayed in the page. Is this correct in the real world when the user clicks on Refresh button? Or should the option selected by the user should be maintained? Please let me know as and when you find time.
Thanks a lot again for the crisp explanation.!!
ASKER
Just to clarify my words:
I would like to know if the option chosen by the user (for eg: any option in a RadioButton or Listbox or DropDown or in the example scenario above) should be maintained in the view state and displayed the options exactly chosen by the user. Or is it fine to clear the values?
I would like to know if the option chosen by the user (for eg: any option in a RadioButton or Listbox or DropDown or in the example scenario above) should be maintained in the view state and displayed the options exactly chosen by the user. Or is it fine to clear the values?
ASKER
Please read this comment instead of the earlier one:
Just to clarify my words:
I would like to know if the option chosen by the user (for eg: any option in a RadioButton or Listbox or DropDown or in the example scenario above) should be maintained in the view state and display the options exactly chosen by the user when the "Refresh button" is clicked? Or is it fine to clear the values?
Just to clarify my words:
I would like to know if the option chosen by the user (for eg: any option in a RadioButton or Listbox or DropDown or in the example scenario above) should be maintained in the view state and display the options exactly chosen by the user when the "Refresh button" is clicked? Or is it fine to clear the values?
This is the normal behavior you find in some browsers. But that can be cleared programitically. Since it is normal I would suggest just to ignore it. Why I am telling this is, there can be an instance that when the page loads, a checkbox has to be selected and in this case we cannot just clear them.
ASKER
Many Thanks, gops1,
Yet another crystal clear explanation from ya.. :)
Can you post this reply here:
https://www.experts-exchange.com/questions/22930616/What-should-be-the-ideal-behavior-of-a-ASP-NET-page-when-Refresh-button-is-clicked.html
I can award you points for this reply...
Thanks again mate!
Yet another crystal clear explanation from ya.. :)
Can you post this reply here:
https://www.experts-exchange.com/questions/22930616/What-should-be-the-ideal-behavior-of-a-ASP-NET-page-when-Refresh-button-is-clicked.html
I can award you points for this reply...
Thanks again mate!
var chkbox = document.createElement('ch
hkbox.id = 'newchk';
chkbox.name = 'chknew';
chkObj.childNodes.Add(chkb