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 4 of 4
  1. #1
    New Coder
    Join Date
    May 2012
    Posts
    56
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Include Checkboxes in an html table

    Hi ,
    I have the following html table. My requirement is if I click on '[Switch into edit mode]", it will introduce some checkboxes in the table rows so that I can select them.

    Code:
    <html>
    <TABLE BORDER=0 BGCOLOR="#F5F5F5">
    <a href="coll.pl?filter=gui&amp;query=flow2&amp;mode=del">[Switch into edit mode]<br></a>
    
    <TR><TD>o</TD><TD><a href="coll.pl?path=/home/default/units/results">Regression 3.2</a></TD><TD><a href="collstat.pl?path=/home/default/units/results">(/home/default/units/results)</a></TD></TR>
    <TR><TD>o</TD><TD><a href="coll.pl?path=/home/micado/units/results">Regression 3.3</a></TD><TD><a href="collstat.pl?path=/home/micado/units/results">(/home/micado/units/results)</a></TD></TR>
    <TR><TD>o</TD><TD><a href="coll.pl?path=/home/pll/dss/top">Regression pll</a></TD><TD><a href="collstat.pl?path=/home/pll/dss/top">(/home/pll/dss/top)</a></TD></TR>
    </TABLE>
    
    </html>
    You can delete the <a href coll.pl > stuff in [Switch into edit mode] and replace that with a javascript function to accomplish the requirement. The desired table should exactly look like below :

    Code:
    <html>
    <TABLE BORDER=0 BGCOLOR="#F5F5F5">
    
    
    <TR><TD>o</TD><TD><a href="coll.pl?path=/home/default/units/results">Regression 3.2</a></TD><TD NOWRAP><label><input type="checkbox" name="DEL=/home/default/units/results" value="on" /> Remove</label></TD><TD><a href="collstat.pl?path=/home/default/units/results">(/home/default/units/results)</a></TD></TR>
    <TR><TD>o</TD><TD><a href="coll.pl?path=/home/micado/units/results">Regression 3.3</a></TD><TD NOWRAP><label><input type="checkbox" name="DEL=/home/micado/units/results" value="on" /> Remove</label></TD><TD><a href="collstat.pl?path=/home/micado/units/results">(/home/micado/units/results)</a></TD></TR>
    <TR><TD>o</TD><TD><a href="coll.pl?path=/home/pll/dss/top">Regression pll</a></TD><TD NOWRAP><label><input type="checkbox" name="DEL=/home/pll/dss/top" value="on" /> Remove</label></TD><TD><a href="collstat.pl?path=/home/pll/dss/top">(/home/pll /dss/top)</a></TD></TR>
    </TABLE>
    
    </html>
    Please help. Thanks.

  • #2
    New Coder
    Join Date
    Sep 2012
    Posts
    22
    Thanks
    0
    Thanked 6 Times in 6 Posts
    This is the code that you are searching.
    Code:
    <html>
    <head>
    <script>
    	function addCheckBox() {
    	
    		var table = document.getElementById("table1"); 
    		for (var i = 0, row; row = table.rows[i]; i++) { 	
    			var x=row.insertCell(2);
    			 x.innerHTML="<label><input type=\"checkbox\" name=\"DEL=/home/default/units/results\" value=\"on\" /> Remove</label>";		      
    		}
    	}
    </script>
    </head>
    <body>
    <TABLE BORDER=0 BGCOLOR="#F5F5F5" id="table1">
    <a href="javascript:addCheckBox();">[Switch into edit mode]<br></a>
    <TR><TD>o</TD><TD><a href="coll.pl?path=/home/default/units/results">Regression 3.2</a></TD><TD><a href="collstat.pl?path=/home/default/units/results">(/home/default/units/results)</a></TD></TR>
    
    <TR><TD>o</TD><TD><a href="coll.pl?path=/home/micado/units/results">Regression 3.3</a></TD><TD><a href="collstat.pl?path=/home/micado/units/results">(/home/micado/units/results)</a></TD></TR>
    
    <TR><TD>o</TD><TD><a href="coll.pl?path=/home/pll/dss/top">Regression pll</a></TD><TD><a href="collstat.pl?path=/home/pll/dss/top">(/home/pll/dss/top)</a></TD></TR>
    
    </TABLE>
    </body>
    </html>

  • #3
    New Coder
    Join Date
    May 2012
    Posts
    56
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Hi shyagrawal

    Thanks a lot. It is working.

  • #4
    New Coder
    Join Date
    May 2012
    Posts
    56
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Hi shyagrawal,

    Is it possible to include a NOWRAP to that cell We included. I mean to say something like :

    Code:
    <TD NOWRAP><label><input type="checkbox" name="DEL=/home/units/clock" value="on" /> Remove</label></TD>

    Thanks .


  •  

    Posting Permissions

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