• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 678
  • Last Modified:

checkbox is too small

<form>
<table>
<tr>
<td>
<input type="checkbox">
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
</table>

<table>
<tr>
<td>
<input type="checkbox">
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
</table>

<table>
<tr>
<td>
<input type="checkbox">
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
</table>

</form>

Open in new window


tried adding
<label>

want a large area
ideally the each <table></table>
where user clicks and checkbox gets clicked

you can add ids and classes
0
rgb192
Asked:
rgb192
  • 2
1 Solution
 
HainKurtSr. System AnalystCommented:
maybe something like this:

<style>
table {width:400; border:10 solid silver;}
</style>
<script>
function chk(id){
  document.getElementById(id).click();
}
</script>

<form>
<table onclick="chk('chk1')">
<tr><td><input id=chk1 type="checkbox"></td>
</table>

<table onclick="chk('chk2')">
<tr><td><input id=chk2 type="checkbox"></td>
</table>

<table onclick="chk('chk3')">
<tr><td><input id=chk3 type="checkbox"></td>
</table>
</form>

Open in new window

0
 
HainKurtSr. System AnalystCommented:
with some fancy style...

<style>
table {width:400; border:10 solid silver; margin:20px;}
td.navon {background-color:yellow}
td.navoff {background-color:white}
</style>
<script>
function chk(id){
  document.getElementById(id).click();
}
</script>

<form>
<table onclick="chk('chk1')">
<tr><td class="navoff" onmouseover="className='navon'" onmouseout="className='navoff'"><input id=chk1 type="checkbox"></td>
</table>

<table onclick="chk('chk2')">
<tr><td class="navoff" onmouseover="className='navon'" onmouseout="className='navoff'"><input id=chk2 type="checkbox"></td>
</table>

<table onclick="chk('chk3')">
<tr><td class="navoff" onmouseover="className='navon'" onmouseout="className='navoff'"><input id=chk3 type="checkbox"></td>
</table>
</form>

Open in new window

0
 
rgb192Author Commented:
thanks

your solution works for 3 tables


looking for a solution for 50 tables

http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_27848530.html
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: C++ 11 Fundamentals

This course will introduce you to C++ 11 and teach you about syntax fundamentals.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now