Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

checkbox to edit box using javascript

Posted on 1997-10-17
7
Medium Priority
?
888 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 

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

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

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

JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
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…

636 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