Web Analytics Made Easy -
StatCounter Is it possible to move check box information... - CodingForum

Announcement

Collapse
No announcement yet.

Is it possible to move check box information...

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new 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
    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; Sep 25, 2006, 12:04 PM.
    bonrouge

    Comment


    • #3
      Thanks! Worked perfectly

      Comment

      Working...
      X