Detect changed input text box

Question

I ve looked at numerous other questions and found very simple answers  including the code below   I simply want to detect when someone changes the content of a text box but for some reason it s not working     I get no console errors   When I set a breakpoint in the browser at the change   function it never hits it         inputDatabaseName   change function           alert  test            lt input id  inputDatabaseName  gt

User · Answer

onkeyup  onpaste  onchange  oninput seems to be failing when the browser performs autofill on the textboxes  To handle such a case include  autocomplete  off   in your textfield to prevent browser from autofilling the textbox   Eg    lt input id  inputDatabaseName  autocomplete  off  onchange  check      onkeyup  this onchange     onpaste  this onchange     oninput  this onchange       gt    lt script gt       function check              alert  Input box changed                 Things to do when the textbox changes         lt  script gt

User · Answer

You can use the input Javascript event in jQuery like this       inputDatabaseName   on  input  function e       alert  Changed          In pure JavaScript   document querySelector  input   addEventListener  change  function        alert  Input Changed         Or like this    lt input id  inputDatabaseName  onchange  youFunction     onkeyup  this onchange     onpaste  this onchange     oninput  this onchange      gt

User · Answer

Each answer is missing some points  so here is my solution    x000D   x000D      input   on  input   function e    x000D    var input     this   x000D    var val   input val    x000D   x000D    if  input data  lastval      val    x000D      input data  lastval   val   x000D   x000D        your change action goes here  x000D      console log val   x000D      x000D   x000D      x000D   lt script src  https   ajax googleapis com ajax libs jquery 2 1 1 jquery min js  gt  lt  script gt  x000D   lt input type  text  id  input  gt  x000D   lt p gt Try to drag the letters and copy paste lt  p gt  x000D   x000D   x000D    The Input Event fires on Keyboard input  Mouse Drag  Autofill and Copy-Paste tested on Chrome and Firefox  Checking for previous value makes it detect real changes  which means not firing when pasting the same thing or typing the same character or etc   Working example  http   jsfiddle net g6pcp 473     update   And if you like to run your change function only when user finishes typing and prevent firing the change action several times  you could try this    x000D   x000D  var timerid  x000D      input   on  input   function e    x000D    var value     this  val    x000D    if    this  data  lastval      value    x000D   x000D        this  data  lastval   value   x000D      clearTimeout timerid   x000D   x000D      timerid   setTimeout function     x000D          your change action goes here  x000D        console log value   x000D         500   x000D       x000D      x000D   lt script src  https   ajax googleapis com ajax libs jquery 2 1 1 jquery min js  gt  lt  script gt  x000D   lt input type  text  id  input  gt  x000D   x000D   x000D    If user starts typing  e g   foobar   this code prevents your change action to run for every letter user types and and only runs when user stops typing  This is good specially for when you send the input to the server  e g  search inputs   that way server does only one search for foobar and not six searches for f and then fo and then foo and foob and so on

User · Answer

In my case  I had a textbox that was attached to a datepicker  The only solution that worked for me was to handle it inside the onSelect event of the datepicker    lt input type  text   id  bookdate  gt       bookdate   datepicker                    onSelect  function  selected               handle change event here

User · Answer

Text inputs do not fire the change event until they lose focus  Click outside of the input and the alert will show   If the callback should fire before the text input loses focus  use the  keyup   event

User · Answer

WORKING       ContentPlaceHolder1 txtNombre   keyup function          var txt     this  val                column   each function                    this  show                if    this  text   toUpperCase   indexOf txt toUpperCase       -1                      this  hide

User · Answer

try keyup instead of change    lt script type  text javascript  gt       document  ready function                 inputDatabaseName   keyup function      alert  test                lt  script gt    Here s the official jQuery documentation for  keyup

User · Answer

I think you can use keydown too       fieldID   on  keydown   function  e        console log e which     if  e which     8          do something when pressing delete     return true      else         do something else     return false

[jquery] Detect changed input text box

Examples related to jquery

Examples related to input