Member Avatar for gunnarflax

Hi,
I'm not good at all at JavaScript but I'm trying, so bear with me.

What I want to do is that when I click on a <input type="text" /> tag the checkbox next to it should become checked. I've tried with the help of internet for a couple of hours but I just can't find how I interact with other objects properly to achieve what I want to accomplish.

I've tried with this code:

<table> <tr> <td><input type="text" onclick="boxTicker(this.form, 'change_user')"/></td><td><input id="change_user" type="checkbox" name="change_user"/></td> </tr> </table> and the javascript... function boxTicker(formName, boxId){ var box = eval("document.checkboxform.getElementById(boxId)"); if (box.checked == false){ box.checked = true; alert("Ticked!"); } }

But I honestly don't have a clue of what I'm doing. I would be very grateful for any help suggested!

  • 4 Contributors
  • 7 Replies
  • 252 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by gunnarflax
Member Avatar for mail2saion

Replace your javascript function by below one:

function boxTicker(formName, boxId){ var box = formName.document.getElementById(boxId); if (box.checked == false){ box.checked = true; alert("Ticked!"); } }
Member Avatar for prisonpassioner

u have done a mistake the value is checked by getting it only so u have to get that from the textbox or any by this syntax
document.formname.textboxname.value...........use this syntax

Member Avatar for gunnarflax

Thanks for the replies but it still doesn't work. I didn't really understand what you meant prisonpassioner but I assumed you said I should try writing

document.formName.getElementById(boxId);

I did but nothing happened. I also did what you told me mail2saion but it had no effect. Can there be a problem with how I write the parameters on the function call?

<form name="edit" action="actions/mm-save_settings.php" method="post"> <input type="text" onclick="boxTicker(this.form, 'change_user')"/><input id="change_user" type="checkbox" name="change_user"/> </form>
Member Avatar for almostbob

Textboxes dont respond well to onclick
onchange onfocus onblur are the methods more commonly used
I would try the same <input> with the javascript attached to 'onfocus'

Edited by almostbob because: n/a
Member Avatar for gunnarflax

Still no result :/ Are you sure that the rest of my code is correct?

Member Avatar for almostbob

my version of the javascript

<script type='text/javascript'> function boxTicker(formName, boxId){ var box = eval("document.getElementById(boxId)"); if (box.checked == false){ box.checked = true; alert("Ticked!"); } }</script>

getelementbyid is a singleton (there can only be a single element with 'id', no parent dom elements but document are required, you could function boxTicker(boxId){ } in this method onclick works(dunno why), onchange would be better, else you may submit a potentially blank form

Edited by almostbob because: n/a
Member Avatar for gunnarflax

my version of the javascript

<script type='text/javascript'> function boxTicker(formName, boxId){ var box = eval("document.getElementById(boxId)"); if (box.checked == false){ box.checked = true; alert("Ticked!"); } }</script>

getelementbyid is a singleton (there can only be a single element with 'id', no parent dom elements but document are required, you could function boxTicker(boxId){ } in this method onclick works(dunno why), onchange would be better, else you may submit a potentially blank form

Thanks almostBob! that solved it! :D

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.