chrisp54
chrisp54

Reputation: 47

calculate with Jquery each time a input changes

I have an application where I have to perform a simple calculation where the price of each item * the amount. I am trying to figure out the best way to do it. I have a input type="number" and I have a item price. I need to update my input fied each time the value of the QTY field changes

    $('#add1').click(function () {
    var selected1 = ($('#produceList option:selected').index() - 1);
    myItem1 = pdata[selected1];
    $('#itembox').append('<div id="thep">' + '<p class = "product">' + myItem1.Name + '    ' + myItem1.Price + '</p>' + '<label for="howMAny">Qty:</label>' + '<input id="howMany" type="number" min="0" max="10" value="0">' + '<label for="thisMany">Price:</label>' + '<input type="text" id ="thisMany"readonly>' + '</div>');

Upvotes: 0

Views: 3155

Answers (3)

Flo
Flo

Reputation: 310

You can use the onchange event for this.

This code should handle it when you are using jQueryY

$('input').on('change', function() {
  alert( this.value );
})

Now, instead of alerting the value you can update your result.

Upvotes: 1

Milind Anantwar
Milind Anantwar

Reputation: 82231

You can write the code in event below. This will be getting triggered everytime textbox for qty changes.

jQuery('#howMany').on('input', function() {
// do your stuff here.
})

Upvotes: 0

Shobhit Sharma
Shobhit Sharma

Reputation: 1609

You can simply use jQuery's change() function. http://api.jquery.com/change/

The change event is sent to an element when its value changes. This event can be used with elements, boxes and elements. For select boxes, checkboxes, and radio buttons, the event is fired immediately when the user makes a selection with the mouse, but for the other element types the event is deferred until the element loses focus.

Upvotes: 1

Related Questions