SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Jun 2010
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Dynamic Check boxs in jsp and Java script

    Hi ,
    I would like to create Dynamic Check Boxes using Java scritp.I got id and name from DataBase.So using those values in Need to build check Boxes in JSP Page.
    I use Below Code but it returns only [object] not checkboxes.
    Java script :
    Code JavaScript:
     var checkbox = document.createElement('input');
     	 checkbox.type = "checkbox";
    	 checkbox.name = id;
    	 checkbox.id = id;
             checkbox.value = name;
     
    						 document.getElementById("attri_types").innerHTML= checkbox;

    JSP :
    <td>
    <div id=attri_types></div>
    </td>

    Please help to fix this issue.Thanks in advance.

  2. #2
    SitePoint Member
    Join Date
    Jun 2010
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Any help?

  3. #3
    SitePoint Enthusiast
    Join Date
    Apr 2009
    Posts
    73
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What does it insert when you use innerHTML on the containing element?

    Your code looks pretty legitimate (although make sure you have quotes around the id attribute of the element if you haven't already)

  4. #4
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't use the .innerHTML property, but I thought that was supposed to be a string value?

    Since you already have a DOM node, you can just add it to the parent's collection:
    Code JavaScript:
    document.getElementById("attri_types").appendChild(checkbox);
    Birnam wood is come to Dunsinane

  5. #5
    SitePoint Member
    Join Date
    Jun 2010
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you so much.it works fine.

    Code JavaScript:
     
    function getCheckBoxes() {
        var attributeVal;
    	for (i=0; i<document.attributeRuleMaintainForm.attrtype.length; i++){
            if (document.attributeRuleMaintainForm.attrtype[i].checked==true)
            {
            	attributeVal = document.attributeRuleMaintainForm.attrtype[i].value
            }
    	} 
    	    // Create the AJAX object
    		var xmlHttp = CreateHttpRequest();
     
    		// Create the action that will be taken when the
    		// reponse has been received.
    		xmlHttp.onreadystatechange = function() {
     
    	 	if(xmlHttp.readyState == 4 && xmlHttp.responseXML) {
    	 		var optionElements1 = xmlHttp.responseXML.getElementsByTagName('option');
     
     
    				if (optionElements1.length > 0) {
    					document.getElementById("attri_types").innerHTML= " ";
    					for(var i = 0; i < optionElements1.length; i++) {
    						 var id = optionElements1[i].getElementsByTagName('id')[0].firstChild.nodeValue;
    						 var name = optionElements1[i].getElementsByTagName('name')[0].firstChild.nodeValue;
    						 var value = value+"<br>"+ id ;
     
    						 if(id > 0) {
     
    							 var checkbox =  document.createElement('input');
    							 checkbox.type = "checkbox";
    							 checkbox.name = "attribute";
    							 checkbox.id = "attribute";
    							 checkbox.value = name;
     
    							 //checkbox.onclick = testit;
     
    							 var text = document.createTextNode( name );
    							var breake = document.createElement("<br>");
     
    	            document.getElementById( 'attri_types' ).appendChild( checkbox );
    	                        document.getElementById( 'attri_types' ).appendChild( text );
    	                        document.getElementById( 'attri_types' ).appendChild( breake );
    						 } else {
    						    document.getElementById("attri_types").innerHTML= "Records not found";
    						 }
    					}
    		     	}
    			}
    		};
    		var url = "./xxxxxxxxx.dd?action=getCheckboxInfo&attrtype="+attributeVal;
     
    		// Send the request
    		xmlHttp.open("POST",url,true);
    		xmlHttp.send(null);
    }


Bookmarks

Posting Permissions

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