Professor_Joykill
Professor_Joykill

Reputation: 989

How to Trigger event to change value in Input Box?

I am attempting to learn HTML and Javascript, and with this, I am working on building a simple calculator device, where all of the numbers and operators are buttons that are clicked, and the results are displayed in an input box. However I have had issues with, when clicking on the buttons, having the events trigger to display the selected numbers value in the box.

Here is my HTML and JS:

var numString = "";

$('.number').click(function() {  
  numString += $(this).val().toString;
  $('input[name=display]').val(numString);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="display" name="display" disabled></input>
<button id="button1" class="number" value="1">1</button>

Upvotes: 0

Views: 252

Answers (2)

Viller
Viller

Reputation: 540

You have a type in $(this).val().toString toString is a function, I believe the intention was to call it like this $(this).val().toString()

After fixing toString, your code would produce 1 -> 11 -> 111...

Upvotes: 1

Niladri
Niladri

Reputation: 5962

Try with the below code . it should be .toString() instead of .toString

var numString = "";
$('.number').click(function() {
     numString += $(this).val().toString();
     $('input[name=display]').val(numString);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="display" name="display" disabled></input>

<button id="button1" class="number" value="1">1</button>

Upvotes: 2

Related Questions