I have few textboxes and an editbutton on a html page - say T1, T2, T3, T4. I have onchange event for T1. The onchange event makes T2 readOnly=true T3,T4 editable(sets readonly property = false)
Now, I have a button - "edit" - what it does is makes T2 readonly=false T3 and T4 uneditable(sets readonly property = true) and focus goes to T1.
Next, I am now at T1. I click tab(even without changing the value of T1) - and the problem arises - onChange event of T1 is fired! and it makes T2 readOnly=true T3,T4 editable(sets readonly property = false) which is undesirable.
How can I avoid onChange of T1 to fire on clicking tab from T1 when T1 is in focus? Any help on this is very much appreciated. Thanks in advance!
I'm not quite sure what you're asking, but onchange might not be the correct function to be using. Make a fiddle or post your code if this doesn't fix it, but try replacing your onchange triggers with onfocus instead.
There won't be any way to prevent the event as soon as you leave the textarea and try to do something else since as soon as you blur the element the change will occur. Browser will detect the blur before the next event handler is fired
You may need to use a short setTimeout
inside your onchange event handler in order to evaluate your T1, T2...
variables before doing whatever it is you do in onchange
With no code provided in question it is hard to help any further
something like:
element.onchange = function(){// or $('#mytestarea').on('change....
setTimeout(function(){
// should have had enough time for tab values to have changed
// do whatever you normally do here
}, 50);
}