link beside checkbox

  • vickriz
  • Novice
  • Novice
  • User avatar
  • Posts: 31
  • Loc: Phlippines

Post 3+ Months Ago

hi there to all.
i have pick this code around the web by clicking the link beside the checkbox it will turn checked.

Code: [ Select ]
Javascript:
<!-- Begin: checkBox setOn when textclick
function changeBox(cbox) {
box = eval(cbox);
box.checked = !box.checked;
}// End -->
HTML:
<form name="ccForm">
<input type="checkbox" name="ccNominated">
<a class="chekbox" href="#" onClick="changeBox('document.ccForm.ccNominatedBy');return false">Checkit!</a><br>
<input type="checkbox" name="ccNominatedBy">
<a class="chekbox" href="#" onClick="changeBox('document.ccForm.ccNominatedBy');return false">Checkit!</a><br>
<input type="text" name="ccNominaterLN" disabed="false">
<input type="text" name="ccNominaterFN" disabed="false">
<input type="text" name="ccNominaterMN" disabed="false">
</form>
  1. Javascript:
  2. <!-- Begin: checkBox setOn when textclick
  3. function changeBox(cbox) {
  4. box = eval(cbox);
  5. box.checked = !box.checked;
  6. }// End -->
  7. HTML:
  8. <form name="ccForm">
  9. <input type="checkbox" name="ccNominated">
  10. <a class="chekbox" href="#" onClick="changeBox('document.ccForm.ccNominatedBy');return false">Checkit!</a><br>
  11. <input type="checkbox" name="ccNominatedBy">
  12. <a class="chekbox" href="#" onClick="changeBox('document.ccForm.ccNominatedBy');return false">Checkit!</a><br>
  13. <input type="text" name="ccNominaterLN" disabed="false">
  14. <input type="text" name="ccNominaterFN" disabed="false">
  15. <input type="text" name="ccNominaterMN" disabed="false">
  16. </form>



now, what i want to do is.. at the same time; by clicking the link to check the box the 3 textbox also will turn disabled. how this will accomplished.. help code from anyone very much appreciated. thanks in advance..
:lol:
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • RichB
  • Guru
  • Guru
  • User avatar
  • Posts: 1121
  • Loc: Boston

Post 3+ Months Ago

try this:

Code: [ Select ]
<html>
<head>
<script>
<!-- Begin: checkBox setOn when textclick
function changeBox(cbox) {
box = eval(cbox);
box.checked = !box.checked;
toggleFields();
}
function toggleFields()
{
document.ccForm.ccNominaterLN.disabled=!document.ccForm.ccNominaterLN.disabled;
document.ccForm.ccNominaterFN.disabled=!document.ccForm.ccNominaterFN.disabled;
document.ccForm.ccNominaterMN.disabled=!document.ccForm.ccNominaterMN.disabled;
}
// End -->
</script>
</head>
<body>
<form name="ccForm">
<br />
<input type="checkbox" name="ccNominatedBy" onclick="toggleFields();">
<br />
<a class="chekbox" href="#" onClick="changeBox('document.ccForm.ccNominatedBy');return false">Checkit!</a><br>
<br />
<input type="text" name="ccNominaterLN">
<br />
<input type="text" name="ccNominaterFN">
<br />
<input type="text" name="ccNominaterMN">
</form>
</body>
</html>
  1. <html>
  2. <head>
  3. <script>
  4. <!-- Begin: checkBox setOn when textclick
  5. function changeBox(cbox) {
  6. box = eval(cbox);
  7. box.checked = !box.checked;
  8. toggleFields();
  9. }
  10. function toggleFields()
  11. {
  12. document.ccForm.ccNominaterLN.disabled=!document.ccForm.ccNominaterLN.disabled;
  13. document.ccForm.ccNominaterFN.disabled=!document.ccForm.ccNominaterFN.disabled;
  14. document.ccForm.ccNominaterMN.disabled=!document.ccForm.ccNominaterMN.disabled;
  15. }
  16. // End -->
  17. </script>
  18. </head>
  19. <body>
  20. <form name="ccForm">
  21. <br />
  22. <input type="checkbox" name="ccNominatedBy" onclick="toggleFields();">
  23. <br />
  24. <a class="chekbox" href="#" onClick="changeBox('document.ccForm.ccNominatedBy');return false">Checkit!</a><br>
  25. <br />
  26. <input type="text" name="ccNominaterLN">
  27. <br />
  28. <input type="text" name="ccNominaterFN">
  29. <br />
  30. <input type="text" name="ccNominaterMN">
  31. </form>
  32. </body>
  33. </html>
  • RichB
  • Guru
  • Guru
  • User avatar
  • Posts: 1121
  • Loc: Boston

Post 3+ Months Ago

I was playing with the code a little bit and realized there are two potential problems.

If you have a reset button in the form it won't enable the text fields again and if the user clicks "refresh" after clicking the checkbox the check isn't removed. I modified the code and was able to fix everything except the refresh problem in IE6.

Code: [ Select ]
<html>
<head>
<script>
<!-- Begin: checkBox setOn when textclick
function changeBox(cbox) {
box = eval(cbox);
box.checked = !box.checked;
toggleFields();
}
function toggleFields()
{
document.ccForm.ccNominaterLN.disabled=!document.ccForm.ccNominaterLN.disabled;
document.ccForm.ccNominaterFN.disabled=!document.ccForm.ccNominaterFN.disabled;
document.ccForm.ccNominaterMN.disabled=!document.ccForm.ccNominaterMN.disabled;
}
function doReset()
{
document.ccForm.ccNominatedBy.checked=false;
document.ccForm.ccNominaterLN.disabled=false;
document.ccForm.ccNominaterFN.disabled=false;
document.ccForm.ccNominaterMN.disabled=false;
}
// End -->
</script>
</head>
<body>
<form name="ccForm" onreset="doReset()">
<br />
<input type="checkbox" name="ccNominatedBy" onclick="toggleFields();">
<br />
<a class="chekbox" href="#" onClick="changeBox('document.ccForm.ccNominatedBy');return false">Checkit!</a><br>
<br />
<input type="text" name="ccNominaterLN">
<br />
<input type="text" name="ccNominaterFN">
<br />
<input type="text" name="ccNominaterMN">
<br />
<input type="reset">
</form>
<script>
//this clears the checkbox on a refresh in NE7 but not in IE6?
document.ccForm.reset()
</script>
</body>
</html>
  1. <html>
  2. <head>
  3. <script>
  4. <!-- Begin: checkBox setOn when textclick
  5. function changeBox(cbox) {
  6. box = eval(cbox);
  7. box.checked = !box.checked;
  8. toggleFields();
  9. }
  10. function toggleFields()
  11. {
  12. document.ccForm.ccNominaterLN.disabled=!document.ccForm.ccNominaterLN.disabled;
  13. document.ccForm.ccNominaterFN.disabled=!document.ccForm.ccNominaterFN.disabled;
  14. document.ccForm.ccNominaterMN.disabled=!document.ccForm.ccNominaterMN.disabled;
  15. }
  16. function doReset()
  17. {
  18. document.ccForm.ccNominatedBy.checked=false;
  19. document.ccForm.ccNominaterLN.disabled=false;
  20. document.ccForm.ccNominaterFN.disabled=false;
  21. document.ccForm.ccNominaterMN.disabled=false;
  22. }
  23. // End -->
  24. </script>
  25. </head>
  26. <body>
  27. <form name="ccForm" onreset="doReset()">
  28. <br />
  29. <input type="checkbox" name="ccNominatedBy" onclick="toggleFields();">
  30. <br />
  31. <a class="chekbox" href="#" onClick="changeBox('document.ccForm.ccNominatedBy');return false">Checkit!</a><br>
  32. <br />
  33. <input type="text" name="ccNominaterLN">
  34. <br />
  35. <input type="text" name="ccNominaterFN">
  36. <br />
  37. <input type="text" name="ccNominaterMN">
  38. <br />
  39. <input type="reset">
  40. </form>
  41. <script>
  42. //this clears the checkbox on a refresh in NE7 but not in IE6?
  43. document.ccForm.reset()
  44. </script>
  45. </body>
  46. </html>


the only remaining problem is if the user checks the box and then refreshes the page in IE. It works fine in opera and NE7, but for some reason I can't get IE to clear the checkbox when the page is refreshed. If anyone has any thoughts on this I'd love to hear them because it's driving me somewhat nuts.
  • vickriz
  • Novice
  • Novice
  • User avatar
  • Posts: 31
  • Loc: Phlippines

Post 3+ Months Ago

Thank you so much body for your good will...
that helps me alot..
RichB wrote:
I was playing with the code a little bit and realized there are two potential problems.

If you have a reset button in the form it won't enable the text fields again and if the user clicks "refresh" after clicking the checkbox the check isn't removed. I modified the code and was able to fix everything except the refresh problem in IE6.

Code: [ Select ]
<html>
<head>
<script>
<!-- Begin: checkBox setOn when textclick
function changeBox(cbox) {
box = eval(cbox);
box.checked = !box.checked;
toggleFields();
}
function toggleFields()
{
document.ccForm.ccNominaterLN.disabled=!document.ccForm.ccNominaterLN.disabled;
document.ccForm.ccNominaterFN.disabled=!document.ccForm.ccNominaterFN.disabled;
document.ccForm.ccNominaterMN.disabled=!document.ccForm.ccNominaterMN.disabled;
}
function doReset()
{
document.ccForm.ccNominatedBy.checked=false;
document.ccForm.ccNominaterLN.disabled=false;
document.ccForm.ccNominaterFN.disabled=false;
document.ccForm.ccNominaterMN.disabled=false;
}
// End -->
</script>
</head>
<body>
<form name="ccForm" onreset="doReset()">
<br />
<input type="checkbox" name="ccNominatedBy" onclick="toggleFields();">
<br />
<a class="chekbox" href="#" onClick="changeBox('document.ccForm.ccNominatedBy');return false">Checkit!</a><br>
<br />
<input type="text" name="ccNominaterLN">
<br />
<input type="text" name="ccNominaterFN">
<br />
<input type="text" name="ccNominaterMN">
<br />
<input type="reset">
</form>
<script>
//this clears the checkbox on a refresh in NE7 but not in IE6?
document.ccForm.reset()
</script>
</body>
</html>
  1. <html>
  2. <head>
  3. <script>
  4. <!-- Begin: checkBox setOn when textclick
  5. function changeBox(cbox) {
  6. box = eval(cbox);
  7. box.checked = !box.checked;
  8. toggleFields();
  9. }
  10. function toggleFields()
  11. {
  12. document.ccForm.ccNominaterLN.disabled=!document.ccForm.ccNominaterLN.disabled;
  13. document.ccForm.ccNominaterFN.disabled=!document.ccForm.ccNominaterFN.disabled;
  14. document.ccForm.ccNominaterMN.disabled=!document.ccForm.ccNominaterMN.disabled;
  15. }
  16. function doReset()
  17. {
  18. document.ccForm.ccNominatedBy.checked=false;
  19. document.ccForm.ccNominaterLN.disabled=false;
  20. document.ccForm.ccNominaterFN.disabled=false;
  21. document.ccForm.ccNominaterMN.disabled=false;
  22. }
  23. // End -->
  24. </script>
  25. </head>
  26. <body>
  27. <form name="ccForm" onreset="doReset()">
  28. <br />
  29. <input type="checkbox" name="ccNominatedBy" onclick="toggleFields();">
  30. <br />
  31. <a class="chekbox" href="#" onClick="changeBox('document.ccForm.ccNominatedBy');return false">Checkit!</a><br>
  32. <br />
  33. <input type="text" name="ccNominaterLN">
  34. <br />
  35. <input type="text" name="ccNominaterFN">
  36. <br />
  37. <input type="text" name="ccNominaterMN">
  38. <br />
  39. <input type="reset">
  40. </form>
  41. <script>
  42. //this clears the checkbox on a refresh in NE7 but not in IE6?
  43. document.ccForm.reset()
  44. </script>
  45. </body>
  46. </html>


the only remaining problem is if the user checks the box and then refreshes the page in IE. It works fine in opera and NE7, but for some reason I can't get IE to clear the checkbox when the page is refreshed. If anyone has any thoughts on this I'd love to hear them because it's driving me somewhat nuts.

Post Information

  • Total Posts in this topic: 4 posts
  • Users browsing this forum: No registered users and 33 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.