Print Reseller Scheme
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

OnClick Dynamic Input Changes

Discussion in 'Website Design Forum:' started by oritzio, Jan 7, 2011.

  1. oritzio

    oritzio Junior Member

    Hey, I have my example here, take a look:
    OnClick Dynamic Input Changes

    Right now if you clicking on number it's writing it in the input text which it's great
    But if you clicking again on any number it's overwrite the previous number.

    How can I make it that that it will be continous?


    Thanks,
    Realife.
     
  2. oritzio

    oritzio Junior Member

    Ok, so i already got the answer for this question,
    In case you wonder also i'm putting the code here:

    Code:
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"   "http://www.w3.org/TR/html4/strict.dtd"><html lang="en"><head><!-- this is for coothead testing and can be removed --><base href="http://oritzio.com/keypad/"><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><meta name="language" content="english"> <meta http-equiv="Content-Style-Type" content="text/css"><meta http-equiv="Content-Script-Type" content="text/javascript"> <title> OnClick Dynamic Input Changes </title> <style type="text/css">body {    margin:0;    background-color:#fff;    font-family:arial,helvetica,sans-serif;    font-size:1em;}#table-01 {    width:150px;    border-collapse:collapse;    margin:auto;}#table-01 td {    padding:0;}h1 {    margin:18px 0;    font-size:100%;    font-weight:normal;    text-align:center;}#table-01 img {    display:block;    width:50px;    height:31px;    cursor:pointer;}#table-01 .height32 {    height:32px;}#table-01 .height33 {    height:33px;}#input-container {    margin-top:36px;    text-align:center;}#input-container input {    margin-bottom:5px;}</style> <script type="text/javascript"> function init(){     var pics=document.getElementById('table-01').getElementsByTagName('img'); for(c=0;c<pics.length;c++) {pics[c].onclick=function(){if(isNaN(this.alt)) {   document.getElementById('sms').value=this.alt;}else {   document.getElementById('sms').value+=this.alt;    }   }  }}window.addEventListener?window.addEventListener('load',init,false):window.attachEvent('onload',init); </script> </head><body> <h1>Enter Code:</h1> <form action="#"><table id="table-01"><tr><td><img src="images/index_01.gif" alt="1"></td><td><img src="images/index_02.gif" alt="2"></td><td><img src="images/index_03.gif" alt="3"></td></tr><tr><td><img src="images/index_04.gif" alt="4" class="height32"></td><td><img src="images/index_05.gif" alt="5" class="height32"></td><td><img src="images/index_06.gif" alt="6" class="height32"></td></tr><tr><td><img src="images/index_07.gif" alt="7" class="height32"></td><td><img src="images/index_08.gif" alt="8" class="height32"></td><td><img src="images/index_09.gif" alt="9" class="height32"></td></tr><tr><td><img src="images/index_10.gif" alt="*" class="height33"></td><td><img src="images/index_11.gif" alt="0" class="height33"></td><td><img src="images/index_12.gif" alt="#" class="height33"></td></tr></table> <div id="input-container"><input type="text" name="sms" id="sms"><br><input type="submit" value="Submit"></div></form> </body></html> 
     

Share This Page