how can a call a function when text value of my textbox changes using jquery?

Question

I have 3 input fields which have values prepopulated and a constant value of total hours 200. I am calculating the avghours as totalhours/datediff of date1 and date2.

My Question is if i change the value of date2 then i want the avghours value to change accordingly. I am not sure which event should be used to fire the method which does the calculation

<input type="text" id ="avghours"/>
<input type="text" id ="date1"/>
<input type="text" id ="date2"/>

Javascript code

 function getavg()
 {

 $('#avghours').val()=totalhours/datediff($('#date2').val(),$('#date1').val(),'day');//datediff is userdefined function to get the datedifference


 }

change will fire only if the focus is lost so that might not be possible is there anyother event that i can use.

Thanks

Prady

Caspar Kleijne · Accepted Answer · 2011-01-27 11:47:56Z

2

change

$('#avghours').val()=totalhours/datediff($('#date2').val(),
                                             $('#date1').val(),'day');

to

 $("#date2").bind("keyup blur change mouseup",function () {
     var d = parseInt(datediff($('#date2').val());
     var v = (totalhours/d) + ' ' + $('#date1').val() + ' day'; <-- mergestrings
     $('#avghours').val(v);
 });

assign via the function instead of the right hand.

edited Jan 27, 2011 at 11:47

answered Jan 27, 2011 at 11:18

Caspar Kleijne

21.9k13 gold badges74 silver badges102 bronze badges

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

5 Comments

Prady Over a year ago

i couldnt understand why the mergestring? datediff was a userdefined function to calulate the date difference. Or am i missing something very obvious?

Caspar Kleijne Over a year ago

no, I understand your correct code, however, I prefer to keep it a bit readable ;)

Prady Over a year ago

oh ok... i got it now... but would keyup work if keyboard is not used. i mean like its pasted using mouse

Caspar Kleijne Over a year ago

edited that a bit, added a bunch of events you can select according your requirements.

Prady Over a year ago

oh tats cool.. didnt know you could add bunch of events like this :)

Andy · Accepted Answer · 2011-01-27 11:18:26Z

0

If you want to update it immediately when the user types you could use the keyup event.

answered Jan 27, 2011 at 11:18

Andy

30.2k9 gold badges43 silver badges59 bronze badges

1 Comment

Prady Over a year ago

what happens if the user doesnot use the keyboard he pastes the date from another field using mouse would this event fire?

electricsheep · Accepted Answer · 2011-01-27 11:19:07Z

0

you could try keypress so...

$('#date2').keypress(function() {
//do calculating average logic here
});

then this would pick up when the value of the textbox has been changed

answered Jan 27, 2011 at 11:19

electricsheep

5,2249 gold badges39 silver badges41 bronze badges

Comments

rahul · Accepted Answer · 2011-01-27 11:19:57Z

0

You can use the .change() event for this.

$("#date2").change(function(){

});

answered Jan 27, 2011 at 11:19

rahul

188k50 gold badges239 silver badges266 bronze badges

1 Comment

Prady Over a year ago

change event fires only if the focus is lost

Bhanu Pratap · Accepted Answer · 2016-08-03 11:59:08Z

0

    [![<html>
<head>
<title></title>
<script>

function multy(val)
{
alert(val.value+"--"+val.id);
}

</script>
</head>
<body>
<input id="txtdemo" type="text" onchange="multy(this);"></br>
<input id="txtdemo" type="text" onchange="multy(this);">
</input>
</body>
</html>][1]][1]

answered Aug 3, 2016 at 11:59

Bhanu Pratap

1,76118 silver badges17 bronze badges

Collectives™ on Stack Overflow

how can a call a function when text value of my textbox changes using jquery?

5 Answers 5

5 Comments

1 Comment

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

5 Comments

1 Comment

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related