search

JohnLouderback / GDB

Generic Data Binder (GDB) for jQuery is a framework agnostic and extremely easy to use 2 way data binder. GDB binds views and models in realtime with live two-way binding and no hefty framework necessary.
http://gdb.thewebdev.guru/
Apache License 2.0
87 stars 11 forks source link

Realtime doesn't work on contenteditable fields in Internet Explorer #7

Open JohnLouderback opened 10 years ago

JohnLouderback commented 10 years ago

The "input" event does not fire on contenteditable fields in Internet Explorer despite the fact the Internet Explorer 9+ supports the "input" event. Because IE supports the "input" event, the "keyup" fallback does not occur. A potential fix for this could be falling back on "keyup" if the browser is IE. This fix does still have its caveats, however. This does not account for context menu options such as "cut, "paste", and "delete" and is thus not entire ideal. Further research will be needed.

userabuser commented 10 years ago

@JohnLouderback Might be worthwhile looking at the MutationObserver object to monitor for cut, paste and delete events outside of keyup.

JohnLouderback commented 10 years ago

Hi, I'll look into this. Thanks for the input! -John

userabuser commented 10 years ago

No worries...

I may end up writing a patch and submitting a PR for you by end of next week on this issue as I am approaching the need to have real time contenteditable fields working in IE9+. If you've already started work on this let me know.

While I still think the MutationObserver is the best approach, there are alternatives such as leveraging the cut, copy, paste and delete events using jQuery.on or natively if you prefer oncut, onpaste, oncopy, ondelete using attachEvent or cut, copy, paste, delete with addEventListener (for IE9+).

JohnLouderback commented 10 years ago

Sorry for the delay! I've recently moved across the country. The biggest trick is determining when to use the MutationObserver since oninput works in other browsers and in IE9 except on contenteditable fields. Though I could just determine is the browser is IE9+ and respond accordingly.