Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Sep 2006
    Posts
    29
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Is it possible to move check box information...

    I'm creating an order form which includes a few check boxes. I was wondering if, the check boxes that are selected can move their information to another text box to show the viewer what they've selected. I'm stuck! Can someone help me out with some coding??

    - Lyss

  • #2
    Regular Coder BonRouge's Avatar
    Join Date
    Mar 2006
    Location
    Sendai, Japan
    Posts
    328
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This might help:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>Value of checkboxes appearing in text box</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <style type="text/css">
    * {
    margin:0;
    padding:0;
    }
    body {
    background-color:white;
    }
    label {
    display:block;
    margin:10px;
    }
    textarea {
    display:block;
    }
    </style>
    
    <script type="text/javascript">
    function getElementsByTagAndClassName(tag,cname) {
     var tags=document.getElementsByTagName(tag);
     var cEls=new Array();
     for (i=0; i<tags.length; i++) {
      var rE = new RegExp("(^|\\s)" + cname + "(\\s|$)");
       if (rE.test(tags[i].className)) {
       cEls.push(tags[i]);
       }
      }
     return cEls;
    }
    function fillBox(tag, cname, target) {
    var boxes=getElementsByTagAndClassName(tag,cname)
    for (j=0; j<boxes.length; j++) {
    	boxes[j].onclick=function() {
    			document.getElementById(target).innerHTML="";
    			for (k=0; k<boxes.length; k++) {
    				if (boxes[k].checked==true) {
    				var item=document.createTextNode(boxes[k].value+"\r");
    				document.getElementById(target).appendChild(item);
    				}
    			}
    		}
    	}
    }
    
    window.onload=function() {fillBox('input','item','order')};
    </script>
    </head>
    <body>
    <form name="theform" id="theform">
    <fieldset>
    <legend>Legend</legend>
    <label>You've ordered:</label> <textarea type="text" name="order" id="order" /></textarea>
    <label>Item 1 <input class="item" type="checkbox" name="item1" value="Item 1" /></label>
    <label>Item 2 <input class="item" type="checkbox" name="item2" value="Item 2" /></label>
    <label>Item 3 <input class="item" type="checkbox" name="item3" value="Item 3" /></label>
    </fieldset>
    </form>
    </body>
    </html>
    Last edited by BonRouge; 09-25-2006 at 04:04 PM.

  • #3
    New Coder
    Join Date
    Sep 2006
    Posts
    29
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks! Worked perfectly


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •