---
title: "how to call a function on textchange in textfield using java script"  
description: "how to call a function on textchange in textfield using java script"  
author: "Anonymous User"  
published: 2013-04-04  
updated: 2013-04-04  
canonical: https://www.mindstick.com/forum/709/how-to-call-a-function-on-textchange-in-textfield-using-java-script  
category: "javascript"  
tags: ["javascript"]  
reading_time: 2 minutes  

---

# how to call a function on textchange in textfield using java script

Hi Mindstickians!\
I have textfiedl on which i am calling a [function](https://www.mindstick.com/articles/13001/multi-statement-table-valued-user-defined-function-in-sql-server) which is given below but [problem](https://yourviews.mindstick.com/view/81399/tackling-the-problem-of-unemployment-during-corona-pandemic) is that it is working on enter but not working on keyup or as the [value](https://www.mindstick.com/articles/23219/an-optimized-description-adds-value-to-experience-and-in-turn-effectively-guest-posting-packages) \
of textfield changes i want to call this method.\
[Javascript](https://www.mindstick.com/articles/874/how-to-create-watermark-text-for-textbox-by-using-javascript):\
$(function() {\
var [input](https://www.mindstick.com/forum/159209/how-can-i-read-convert-an-input-stream-into-a-string-in-java) = $('.input'), bar = $('.bar'), bw = bar.width(), percent = bar.find('.percent'), ps = percent.find('span');\
input.on('keydown', function(e) { if (e.keyCode == 13) { var t = $(this), val = t.val(); if (val >= 0 && val <= 100) { var w = 100 - val, pw = (bw * w) / 100, pa = { height: w + '%' }, cw = (bw - pw) / 2, ca = { left: cw } ps.animate(pa); cs.text(val + '%'); circle.animate(ca, function () { circle.removeClass(name) }).addClass(name); } else { [alert](https://answers.mindstick.com/qa/30927/what-is-an-alert)('[range](https://www.mindstick.com/articles/23243/complete-troubleshooting-tips-for-belkin-n300-range-extender-setup): 0 - 100'); t.val(''); } } });\
});[Html](https://www.mindstick.com/articles/1530/design-a-simple-stylish-calculator-using-html-css-and-javascript):\
<div [class](https://www.mindstick.com/blog/165/generic-class-in-c-sharp)="text"> <input type="text" class="input" value="0" id="sliderValue170h" /></div>\
Thank in [advance](https://www.mindstick.com/blog/33258/jee-mains-and-jee-advance-exams)!

## Replies

### Reply by Vijay Shukla

Hi Jacob!\
you can use onkeypress event like this :\
**HTML**\

```
   <div class="text">   <input type="text" class="input"  value="0" onkeypress="return runScript(event)"   id="sliderValue170h"/>   </div>
```

**Javascript**\

```
 function runScript(e) {     //Set Your logic      if (e.keyCode == 13) {      } }
```

### Reply by AVADHESH PATEL

Hi Jacob!\
just add change to the function that it works for both keydown and change:\
$(function() {\
var input = $('.input'), bar = $('.bar'), bw = bar.width(), percent = bar.find('.percent'), ps = percent.find('span');\
input.on('keydown change', function(e) { // in here it works for both keydown and change if (e.keyCode == 13) { var t = $(this), val = t.val(); if (val >= 0 && val <= 100) { var w = 100 - val, pw = (bw * w) / 100, pa = { height: w + '%' }, cw = (bw - pw) / 2, ca = { left: cw } ps.animate(pa); cs.text(val + '%'); circle.animate(ca, function () { circle.removeClass(name) }).addClass(name); } else { alert('range: 0 - 100'); t.val(''); } }});


---

Original Source: https://www.mindstick.com/forum/709/how-to-call-a-function-on-textchange-in-textfield-using-java-script

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.