Update Javascript after value change

Question

Right now I have a project that calculates startTime, EndTime - breakTime. and displays that into a WorkedHours Field.

Like this:

I have a time picker to choose the time, but my calculate script dosen't run after I changed the value. It runs when I step into the text box. So if I were to change it like this:

It will not updated Tid Jobbad Until I step into that same textbox again. How do I make it call the function each time the value changes?

This is the script:

    $(function() {
    $('#breakTime,#startTime,#endTime')
      .blur(CalculateTime);
    CalculateTime();
});


function CalculateTime() {
    try {
        var originalStartTime = $('#startTime').val(),
          originalEndTime = $('#endTime').val(),
          originalBreakTime = $('#breakTime').val();

        // breaking hours and minutes. needed format: HH:mm
        var startHours = originalStartTime.substring(0, 2).replace(':', ''),
          startMinutes = originalStartTime.substring(3, 5),
          endHours = originalEndTime.substring(0, 2).replace(':', ''),
          endMinutes = originalEndTime.substring(3, 5);

        // momentJs variables
        var mStart = moment().hour(startHours).minute(startMinutes),
          mEnd = moment().hour(endHours).minute(endMinutes),
          mBreak = moment.duration(originalBreakTime);

        var result = mEnd.subtract(mStart).subtract(mBreak).format('HH:mm');

        $('#workedHours').val(result);

    } catch (err) {
        $('#workedHours').val(err);
    }
}

If you want to check if an input value has changed, you can use change event — Iván Rodríguez Torres
– Iván Rodríguez Torres, Commented Sep 10, 2015 at 10:20

arturkin · Accepted Answer · 2015-09-10 10:32:01Z

1

Y're using blur event and it is sent to an element when it loses focus. So if you want to recalculate values on change, you need to bind onChange javascript event:

$('#breakTime, #startTime, #endTime').change(CalculateTime);

edited Sep 10, 2015 at 10:32

answered Sep 10, 2015 at 10:24

arturkin

9571 gold badge6 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Update Javascript after value change

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related