onChange for a textfield

Posted on 2006-07-21
Last Modified: 2011-10-03
Hi guys,

I want to know how I can make an alert, which will display the contents of a textfield, after the textfield's value has changed. I want this message to run only if:

- The contents of the field has changed from the original value.
- The field is no longer selected (eg, tab was pressed, or something else was clicked)

I only need this to work with Internet Explorer, any ideas guys?

Question by:Cyber-Drugs
  • 3
LVL 23

Accepted Solution

apresto earned 300 total points
ID: 17153664
Hi Cyber-Drugs,

var oldValue = "";

function alertOnChange( txtBox )
   if ( txtBox.value != oldValue )
       oldValue = txtBox.value;
       alert( oldValue );

onchange="alertOnChange( this );"

LVL 23

Expert Comment

ID: 17153702
sorry, stick it in the onBlur event
LVL 19

Assisted Solution

nschafer earned 200 total points
ID: 17153709
Hi Cyber-Drugs,

<script type="text/javascript">
var txtVal
function setVal() {
  txtVal = document.getElementById('YourTextBoxId').value

function checkVal() {
  if (document.getElementById('YourTextBoxId').value != txtVal) {
    alert('You changed the value.');

In your text box have code like this:

<input type="text" id="YourTextBoxId" onfocus="setVal();" onblur="checkVal();" />

Hope this helps,

Author Comment

ID: 17153755
Thanks for the code guys, I am going to use apresto's code as it runs with a single function, and call, but both answers are valid, so I am going to split the points.

Thanks again guys!
LVL 23

Expert Comment

ID: 17153802
No Problem, Glad i could help


Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Optimize simple Javascript code to use no repetitions 12 43
Hide Table in merge 3 29
Find closest specified item from present item - Javascript 5 33
jQuery force form POST 7 43
In Part 1 ( we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

789 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question