views:

1470

answers:

3

I'm trying to subscribe to change events on an input tag for an ajax auto complete form. These change events are not firing when the user clicks an autocomplete suggestion from FireFox.

I've seen fixes for IE, but not FireFox. You can view this behavior here

Steps to recreate: type any input in one of the boxes and click submit.

Start typing the value again in the same box.

You should see the autocomplete suggestion box appear below the input box. Notice that clicking the suggestion does not fire the change event (it also doesn't fire the click event)

Currently my only option is to disable autocomplete on this field, but I do not want to do that.

A: 

A possibly alternative: could you simply use a timer to tell when the value of the text box changes?

RichieHindle
A: 

You're going to have to blur the input field and reset the focus to it. That's going to require a little trickeration though.

geowa4
+4  A: 

If it makes you feel better, it is a known bug

Proposed workaround: (Not mine, from here

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;
<html>
<head>
<title>Mozilla Firefox Problem</title>
<script type="text/javascript">
function fOnChange()
{
  alert('OnChange Fired');
}

var val_textBox;

function fOnFocus()
{
  val_textBox = document.getElementById('textBox').value;
}

function fOnBlur()
{
  if (val_textBox != document.getElementById('textBox').value) {
    fOnChange();
  }
}
</script>
</head>
<body>
<form name="frm">
<table>
<tr>
<td><input type="text" id="textBox" name="textBox" onFocus="fOnFocus()" onBlur="fOnBlur()"></td>
</tr>
<tr>
<td><input type="submit" value="Submit"></td>
</tr>
</form>
</body>
</html>
Serapth