Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

If used with databinding the input flickers and looses focus #7

Open
GoogleCodeExporter opened this issue Apr 4, 2015 · 0 comments

Comments

@GoogleCodeExporter
Copy link

By referring to  
http://books.zkoss.org/wiki/ZK%20Developer's%20Reference/MVVM/Advanced/Binding%2
0Annotation%20for%20a%20Custom%20Component#Declare_Data_Binding_in_Language_Addo
n_XML I was able to enable ZK databinding for codemirror component. I was 
trying to bind a Viewmodel property with codemirror with @bind annotation. 

Test case
1. Load some default value
2. change the value of codemirror manually
3. click the "Add Text" button

Expected:
In step #2 the cursor should stay inside the codemirror editor at all times

Actual:
In step #2 after you enter few chars (dur to default delay config) an onChange 
event is fired causing the binder to reload the property in codemirror again. 
This work fine but at the end codemirror editor looses its focus

Notes:
In general databinding implementation the value from component is saved to 
ViewModel whenever there is a onChange event. However for codemirror I see 
onChange is fired for
1. everytime the value in codemirror changes i.e. for every keystroke
2. any cursor activity
because of the default config is 

//from js/codemirror/Codemirror.js _init function
var defaultConfig = {
                                path: zk.ajaxURI("/web/js/codemirror/codemirror/js/", {au : true, ignoreSession : true}),
                                stylesheet: css,
                    parserfile: syntax["js"],
                                readOnly: this._readonly,
                                content: this._value,
                                onChange: function() { wgt._processChange(); },
                                onCursorActivity: function() { wgt._processChange(); }
                };

Ideally if you follow ZK Textbox component behavior it firs onChange when user 
tabs out of the input element i.e. onBlur.
Currently this is not possible with Codemirror component as it doesn't have any 
config options to add onBlur handling.
However I saw in CodeMirror 3.x version there is a Codemirror.on() method that 
allows you to specify a callback function when ever Codemirror looses focus.

Any idea how to get around this in current Codemirror 2.x based implementation 
or any thoughts how easy it is to upgrade to CodeMirror 3.x version?

Original issue reported on code.google.com by ash...@potix.com on 26 Apr 2013 at 4:06

Attachments:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant