By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
434,793 Members | 1,252 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 434,793 IT Pros & Developers. It's quick & easy.

Adding & Removing Form Options

P: n/a
I'm trying to add more form options depending on what you chose and then
remove the form options if the main option is deselected. The latter is what
I'm having the problem with.

I only need suggestions on the checkbox options, not the radio options.
Depending on what advice I get for the checkbox options, I can alter the code
for the radio options.

The form code is very long so I'll only post the problem area and it's
related snippets.
Expand|Select|Wrap|Line Numbers
  1.  
  2.  
  3. function attachHandlers(){
  4. var the_button = document.getElementById("my_button");
  5. the_button.onclick=function(){return checkFormFields();};
  6.  
  7. var radio_sel = document.getElementById("radiochoice");
  8. radio_sel.onclick=addRadioOpts;
  9.  
  10. var chkbox_sel = document.getElementById("checkchoice");
  11. chkbox_sel.onclick=addCheckOpts;
  12. }
  13.  
  14. .....
  15.  
  16. function addCheckOpts(){
  17.  
  18. var chicken_sel = document.getElementById("checkchoice");
  19.  
  20. if (chicken_sel.checked==true)
  21. {
  22. var newInput3 = document.createElement('input');
  23. newInput3.type = "radio";
  24. newInput3.id = "first_child";
  25. newInput3.name = "choice";
  26. newInput3.size = "2";
  27. newInput3.className = 'textstyle';
  28. newInput3.value = "chicken'n'pasta";
  29.  
  30. var nameText3 = document.createTextNode("chicken'n'pasta");
  31.  
  32.  
  33. var newInput4 = document.createElement('input');
  34. newInput4.type = "radio";
  35. newInput4.id = "second_child";
  36. newInput4.name = "choice";
  37. newInput4.size = "2";
  38. newInput4.className = 'textstyle';
  39. newInput4.value = "chicken'n'potatoes";
  40.  
  41. var nameText4 = document.createTextNode("chicken'n'potatoes");
  42.  
  43. var the_box = document.getElementById("mainchkbox");
  44. var the_cell = the_box.parentNode;
  45.  
  46. var the_break = document.createElement('br');
  47.  
  48.  
  49. the_cell.insertBefore(newInput3, the_box);
  50. the_cell.insertBefore(nameText3, the_box);
  51. the_cell.insertBefore(newInput4, the_box);
  52. the_cell.insertBefore(nameText4, the_box);
  53. the_cell.insertBefore(the_break, newInput4);
  54. the_cell.insertBefore(the_break, the_box);
  55. the_cell.insertBefore(the_break, second_input);
  56.  
  57. }
  58.  
  59. return;
  60.  
  61. }
  62.  
This code adds the options, but I need it to remove the options when the
checkbox is deselected.
Please help. Thanks.

--
Message posted via WebmasterKB.com
http://www.webmasterkb.com/Uwe/Forum...cript/200809/1

Sep 21 '08 #1
Share this Question
Share on Google+
2 Replies


P: n/a
SAM
LayneMitch via WebmasterKB.com a écrit :
I'm trying to add more form options depending on what you chose and then
remove the form options if the main option is deselected.

[code]

function attachHandlers(){
var the_button = document.getElementById("my_button");
the_button.onclick=function(){return checkFormFields();};

var radio_sel = document.getElementById("radiochoice");
radio_sel.onclick=addRadioOpts;

var chkbox_sel = document.getElementById("checkchoice");
chkbox_sel.onclick=addCheckOpts;
}
var new_elemt = function(e_type,e_name,e_class,e_value,e_target) {
var e, t, b;
e = document.createElement('input');
e.type = e_type;
e.name = e_name;
e.className = e_class,
e.value = e_value;
// there is no "size" with a radio-button
// the id is of no utility
t = document.createTextNode(' '+e_value);
b = document.createElement('br');
e_target = document.getElementById(e_target);
with(e_target.parentNode) {
insertBefore(e, e_target);
insertBefore(t, e_target);
insertBefore(b, e_target);
}
}

function addCheckOpts(){
if (document.getElementById("checkchoice").checked) {
new_elemt('radio', // type
'choice', // name
'textstyle', // class
'chicken\'n\'pasta', // text and value
'mainchkbox'); // target
new_elemt('radio',
'choice',
'textstyle',
'chicken\'n\'potatoes',
'mainchkbox');
}
else {
var box = document.getElementById("mainchkbox").parentNode;
while(box.firstChild && box.firstChild.id != 'mainchkbox')
box.removeChild(box.firstChild);
}
}
--
sm
Sep 21 '08 #2

P: n/a
SAM wrote:
>LayneMitch via WebmasterKB.com a écrit :
>I'm trying to add more form options depending on what you chose and then
remove the form options if the main option is deselected.
[quoted text clipped - 11 lines]
>chkbox_sel.onclick=addCheckOpts;
}

var new_elemt = function(e_type,e_name,e_class,e_value,e_target) {
var e, t, b;
e = document.createElement('input');
e.type = e_type;
e.name = e_name;
e.className = e_class,
e.value = e_value;
// there is no "size" with a radio-button
// the id is of no utility
t = document.createTextNode(' '+e_value);
b = document.createElement('br');
e_target = document.getElementById(e_target);
with(e_target.parentNode) {
insertBefore(e, e_target);
insertBefore(t, e_target);
insertBefore(b, e_target);
}
}

function addCheckOpts(){
if (document.getElementById("checkchoice").checked) {
new_elemt('radio', // type
'choice', // name
'textstyle', // class
'chicken\'n\'pasta', // text and value
'mainchkbox'); // target
new_elemt('radio',
'choice',
'textstyle',
'chicken\'n\'potatoes',
'mainchkbox');
}
else {
var box = document.getElementById("mainchkbox").parentNode;
while(box.firstChild && box.firstChild.id != 'mainchkbox')
box.removeChild(box.firstChild);
}
}
Thanks...Got it. It worked...Really appreciate your response!

--
Message posted via WebmasterKB.com
http://www.webmasterkb.com/Uwe/Forum...cript/200809/1

Sep 21 '08 #3

This discussion thread is closed

Replies have been disabled for this discussion.