javascript to change the contents of an editbox in a form.

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
robster
Forum Contributor
Posts: 360
Joined: Wed Jul 16, 2003 8:28 am
Location: Sunshine Coast, Australia

javascript to change the contents of an editbox in a form.

Post by robster »

Hi there.

I am creating a little application with php and need some javascript (and some javascript help). I've NEVER used javascript before today, having always shyed away from it, but have found a great need for it.

I basically have, on screen, a numeric keypad. Numbered 0-9. The idea is, a user clicks on the numbers to enter their 4 digit entry code then hits ENTER image and they go into the site.

Note these digits are images and when they do their onclick event, they are to change an editbox (which is a password type, so it shows only stars).

I've got it working in this manner at present:

Code: Select all

<table width="200" border="0" cellpadding="5" align="center">
  <tr>
    <td><img src="images/input-pad_01.png" width="65" onClick="document.login.editBox.value = 1" ></td>
    <td><img src="images/input-pad_02.png" width="65" height="65" onClick="document.login.editBox.value = 2"></td>
    <td><img src="images/input-pad_03.png" width="65" height="65" onClick="document.login.editBox.value = 3"></td>
  </tr>
  <tr>
    <td><img src="images/input-pad_04.png" width="65" height="65" onClick="document.login.editBox.value = 4"></td>
    <td><img src="images/input-pad_05.png" width="65" height="65" onClick="document.login.editBox.value = 5"></td>
    <td><img src="images/input-pad_06.png" width="65" height="65" onClick="document.login.editBox.value = 6"></td>
  </tr>
  <tr>
    <td><img src="images/input-pad_07.png" width="65" height="65" onClick="document.login.editBox.value = 7"></td>
    <td><img src="images/input-pad_08.png" width="65" height="65" onClick="document.login.editBox.value = 8"></td>
    <td><img src="images/input-pad_09.png" width="65" height="65" onClick="document.login.editBox.value = 9"></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td><img src="images/input-pad_00.png" width="65" height="65" onClick="document.login.editBox.value = 0"></td>
    <td>&nbsp;</td>
  </tr>
</table>
and it works great, except that it won't enter all 4 digits required as it REPLACES the contents of editBox.value with the integer I've chosen.

What I need to do is APPEND the digit onto the end of the current value in editBox.

Does anyone know how to do that?

Thanks for your time, all help is really appreciated, a complete neub at javascript here!!!

:)

Rob
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

+= instead of =
User avatar
robster
Forum Contributor
Posts: 360
Joined: Wed Jul 16, 2003 8:28 am
Location: Sunshine Coast, Australia

Post by robster »

thank you SO much, how easy is that! LOL.

Always is tho... init ;)

Really, much appreciated, thanks again.

Rob
Post Reply