3

I have a script with a HTML form with a text field inside, right now this text field allows only numbers.

Although I would like to have the text field only allow numbers, and only allow the current value of a variable +1. For example, say the current value of the variable(currentValue) is 1 then the only number you can put into the text field is 2.

Here is the code I have so far:

HTML:

<form id="value-form" action="value.php" method="POST" name="value-form">
<input onkeypress="return isNumberKey(event)" type="text" name="amount" id="amount" /> <!-- This is the text field I would like to only allow the value+1 -->
<input type="image"  src="Button1.png" id="customButton" value="submit" alt="but"/>
</form>

Javascript:

function isNumberKey(evt) //This is the function I use to only allow numbers in the text field
{
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;

return true;
}

var request = new XMLHttpRequest();
request.open('GET', 'currentValueFile.txt', false);
request.send();

var currentValue = request.responseText //this is the variable value I want to only allow +1 in the text field
document.getElementById("currentValue").innerHTML = currentValue;
shaun
  • 1,017
  • 11
  • 22
Fulgut98
  • 323
  • 1
  • 2
  • 12

1 Answers1

3
<form id="value-form" action="value.php" method="POST" name="value-form">
<input onkeypress="return isNumberKey(event)" type="text" name="amount" id="amount" /> <!-- This is the text field I would like to only allow the value+1 -->
<input type="image"  src="Button1.png" id="customButton" value="submit" alt="but"/>
</form>

<script type="text/javascript">
function toDec(code) {
  return code - 48;
}
function isNumberKey(evt) //This is the function I use to only allow numbers in the text field
{
    var charCode = (evt.which) ? evt.which : event.keyCode
    if (charCode > 31 && (charCode < 48 || charCode > 57 || toDec(charCode) != currentValue + 1))
      return false;

    return true;
}

</script>

<script type="text/javascript"> 
var request = new XMLHttpRequest();
request.open('GET', 'currentValueFile.txt', false);
request.send();

var currentValue = parseInt(request.responseText) //this is the variable value I want to only allow +1 in the text field

</script>
brianjob
  • 360
  • 1
  • 9
  • I have just tested your code, it doesn't work but thank you for the suggestion. – Fulgut98 Apr 04 '15 at 23:06
  • I updated my answer and included a jsfiddle. currentValue is set to 2 and it doesn't allow any thing other than 3 to be entered. – brianjob Apr 04 '15 at 23:31
  • I appreciate the effort, it only works for firefox which is a problem, I have tested it on both firefox, opera and google chrome – Fulgut98 Apr 04 '15 at 23:55
  • I have tested your script on all the browsers in jsfiddle now and it works, only problem is that when I implement it to my own script, it doesn't work because my variable get the value from a .txt file, I think that is the problem, and therefore it only works if it is a set value. I really appreciate your help. – Fulgut98 Apr 05 '15 at 01:40
  • request.responseText is a string so you just have to pass it to parseInt before you do anything with it. I updated my answer again to get the value from a file now. – brianjob Apr 05 '15 at 02:26
  • I have tested the script and added to my own and it still won't work, here is a link to my code as how it looks right now, I have done just as in your script. http://pastie.org/private/vtupdamjlefl1bs4pb2za – Fulgut98 Apr 05 '15 at 17:51
  • My mistake, I accidentally removed part of the answer on my last edit. I've fixed it now. However, this code will only work if you have a web server configured to serve the currentValueFile.txt file. If you don't have this set up, most browsers will block the xmlhttprequest. See this answer for more details: http://stackoverflow.com/questions/10752055/cross-origin-requests-are-only-supported-for-http-error-when-loading-a-local – brianjob Apr 05 '15 at 18:50
  • thank you very much for the help, it got me on the way of fixing my problem. – Fulgut98 Apr 06 '15 at 17:45