ansaurus

Question

Answer 1

+1 A:

What key is it? If that key isn't a standard input key, set the onchange to check the field for the change of the field.

You also can bind an onkeypress do the document, and return:false; when the key that changes the input to blue is pressed.

A little more context could help.

CodeJoust 2009-10-26 22:32:01

Basically when I press enter on an input field, I simulate a tab key press by focusing on the next input field (lets not debate this issue). However I need my change handlers to fire if the input element changes value. Just focusing on the next field does not invoke the browser's built-in change mechanism.Using jquery .focus() on the next field or .blur() on the current does not trigger change handling. I need to manually invoke .change() but I don't want to it happen when the value is not changed, and I don't want it called twice in case the user clicks on another field thus invoking it.

Dmitriy Likhten 2009-10-26 22:43:16

Have you tried the onchange handler on the field itself - http://www.w3.org/TR/html401/interact/scripts.html#adef-onchange ?

Cebjyre 2009-10-26 23:23:10

I am using jQuery 1.2.6 for the event handling. I will experiment further.

Dmitriy Likhten 2009-10-27 14:19:49

Answer 2

+1 A:

If I get you right, you need two variables to remember previous and current states of the input, and a listener to handle interaction:

<html>
<head>
<script language="javascript">
var startFieldValue = "Some value, possibly value of input when it is loaded";
var endFieldValue = "";
var focusFlag = 0;
function interact(keyEvent) {
    if(focusFlag == 1)
        return true;
    var key = keyEvent.keyCode? keyEvent.keyCode : keyEvent.charCode
    if(String.fromCharCode(key) == "a") {
        if(startFieldValue != endFieldValue) {
            var elem = document.getElementById('input-to-be-changed');
            elem.style.backgroundColor = "blue";
            startFieldValue = endFieldValue;
        }
    }
}
</script>
</head>
<body onkeypress="interact(event);">
<input id="input-to-be-changed" onchange="endFieldValue = document.getElementById('input-to-be-changed').value;" onfocus="focusFlag = 1;" onblur="focusFlag = 0;">
</body>

Just read the comment on previous post, you should have global idea of what's going on, though. Changes are removing checking for focus, and placing listner (onkeypress) inside every input. The function interact should take 2 values - event and id of input to focus next. Also focusing new element should change startFieldValue. Sorry to not write code itself, but it's kinda late and I really need some sleep.

raceCh- 2009-10-26 23:15:39

My problem is: I can easily remember the previous value on focus, then check for the value again on blur, if changed invoke the change event manually. However I need to ensure that the regular change event which fires on blur due to mouse interactions does not cause 2x change event triggering.

Dmitriy Likhten 2009-10-27 14:15:44

I guess that after blurring input with keyboard (enter causing focusing next input), the onblur will not be fired again. Simply use onkeypress for listening, and let onblur do just nothing, leave it empty. If you need same interaction for regular mouse clicking on other input, then you just use those two variables for field values. After finishing interaction event, script changes startFieldValue to EndFieldValue. And if they are the same, ie nothing changed or function got completed for that input just now, the code will not trigger (its in line "if(startFieldValue != EndFieldValue) {"

raceCh- 2009-10-27 14:41:55

ansaurus

tags:

views:

answers:

Input change event on blur

related questions