Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

checkbox to edit box using javascript

Posted on 1997-10-17
7
Medium Priority
?
890 Views
Last Modified: 2008-03-10
Is it possible to have a list of checkboxes that have value's and when a user clicks one of the check boxes, I want the value of it to be displayed in a textbox.  But I want the to be able to put multiple value's in.  e.g. if i had three check boxes with values 1, 2 and 3.  If I checked boxes 1 and 3 then in the text box i would like to 12.  ok i hope you understand.  Is it possible and if so where might I find some example code.

Thanks

Marvin...
0
Comment
Question by:checkin
  • 4
  • 3
7 Comments
 
LVL 6

Accepted Solution

by:
Holger101497 earned 400 total points
ID: 1271485
Hi checkin! (Marvin)
What you want is not actually so hard... you just add an onclick-eventhandler to your checkboxes that sets the value in the textbox... as soon as the user clicks one of the checkboxes, your textbox will be updated. I'll still post a little sample code in a few minutes, I'd just like to have the question locked first, because yesterday somebody answered a question while I was writing a longer explanation... I assume you meant to say 13 instead of 12?

BRB... ;-))
0
 
LVL 6

Expert Comment

by:Holger101497
ID: 1271486
So, here we go... this is the code you need to make it work. I set it up as a very general procedure that can even be used for several forms or checkbox-groups on the same page, because it takes the checkboxes and the textbox as parameters. There's also a little "trick" - use the same name for all the checkboxes, so they are one array and can be easily passed and evaluated in a loop.

<HTML><HEAD><TITLE>Chk2Txt</TITLE>

<script>
function chk2txt(chk,txt) {
  txt.value='';
  for (var i=0;i<chk.length;i++) if (chk[i].checked) txt.value+=chk[i].value;
}

</script></HEAD>

<BODY>
  <FORM>
    <INPUT TYPE=checkbox name=fchk value="1" onclick="chk2txt(form.fchk, form.ftxt)">1<BR>
    <INPUT TYPE=checkbox name=fchk value="2" onclick="chk2txt(form.fchk, form.ftxt)">2<BR>
    <INPUT TYPE=checkbox name=fchk value="3" onclick="chk2txt(form.fchk, form.ftxt)">3<BR>
    <INPUT TYPE=text name=ftxt>
</FORM>
</BODY>
</HTML>

I hope that's all you were looking for; if not, just ask.

Good luck, Holger :-)
0
 

Author Comment

by:checkin
ID: 1271487
Hi !
Thats exactly what I was looking for but in addition to that is it possible, if somebody unclicks the checkbox to re-update the edit box ? So you would take a value out of the edit box.

Marvin
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:checkin
ID: 1271488
Hi !
Thats exactly what I was looking for but in addition to that is it possible, if somebody unclicks the checkbox to re-update the edit box ? So you would take a value out of the edit box.

Marvin
0
 
LVL 6

Expert Comment

by:Holger101497
ID: 1271489
It is very possible!! As a matter of fact, it already does!! Just try the code. It is an onCLICK-handler, no an onCHECK.
That means that the little procedure is called whenever somebody CLICKS the checkbox, regardless of whether he checks or unchecks it.
chk2txt() first clears the textbox and then adds the values for the checked boxes, so that only the values for the checked boxes appear.

Just cut&copy the code, try it and ask if you still have any questions :-)

Have fun!
0
 

Author Comment

by:checkin
ID: 1271490
There is just one well two mor things,  the first one is that this only works in Netscape and not in MSIE.  If it is possible to get it to work in MSIE that would be great!  The other thing is, is it possible to keep the order of the numbers put in the box.  So if I clicked 2, 1 then 3,  displayed in the box would be 213.  And if I then clciked 1 again in the box would be 23.

Is it possible !

Thanks
Marvin...
0
 

Author Comment

by:checkin
ID: 1271491
Hello Holger are you there !
0

Featured Post

[Webinar] Database Backup and Recovery

Does your company store data on premises, off site, in the cloud, or a combination of these? If you answered “yes”, you need a data backup recovery plan that fits each and every platform. Watch now as as Percona teaches us how to build agile data backup recovery plan.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
In Part 1 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7849-Hex-Maze.html) we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

581 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question