Not possible to edit text fields with redrawOnChange=true

[martintaal]

Hi,

Having a TextItem with redrawOnChange, each time the field is changed it is redrawn. As part of it, focus is set back to this item but as consequence, selection and cursor position is changed:

*In first case (selectOnFocus true), after doing any modification the text in the field is selected, if i don't realize it and hit a new key the whole selection is replaced by new key.
*Second case (selectOnFocus false), after modification cursor is positioned on the last character of the text.

In both cases editions in unmanageable.

Is there any workaround to for this?

Tested with SmartClient Version: SC_SNAPSHOT-2012-02-04_v8.1p/LGPL Development Only (built 2012-02-04)
In Chromium 16.0.912.77 and Firefox 10.0.1

Below you have the problematic code.

Thanks

isc.DynamicForm.create({
    width: 600,
    fields: [
       {name: 't2',
         type: 'text',
         title: 'selectOnFocus true',
         defaultValue: 'Change me...',
         redrawOnChange: true,
         selectOnFocus: true
        },
        {name: 't1',
         type: 'text',
         title: 'selectOnFocus false',
         defaultValue: 'Change me...',
         redrawOnChange: true,
         selectOnFocus: false
        }
    ]
});

[martintaal]

Regarding second case (cursor goes to last position after key stroke), I've debugged FormItem in _refocusAfterRedraw method, it does resetToLastSelection (line 4990). When doing it this._lastSelectionStart and this._lastSelectionEnd are correct, but it seems later selection is lost somewhere else...

[Isomorphic]

What's your use case for redrawOnChange:true? That's a bit of a sledgehammer approach and you wouldn't want to redraw on every keystroke if it's avoidable. Have you considered transformInput and other APIs for modifying the text value while it's being typed?

[martintaal]

I have redrawonchange on true because I have displaylogic to handle hiding/showing/enabling/disabling of fields when a field value changes.

Or is the showIf (of other non-changing fields) als executed in other cases also (than redraw)?

gr. Martin

[Isomorphic]

Yes, but the difference is, redrawOnChange on a TextItem means a redraw on every keystroke. If there are specific things they can type into this field that should trigger other fields to be shown or hidden, you could put that logic into a changed() handler so that redraws only occur when you actually need them to.

[martintaal]

Hmm, I implemented hide/show stuff in the showIf, is there a way to automatically trigger the showIf logic (for all fields of the form) after a change? Like one method to call on a DynamicForm.

gr. Martin

[Isomorphic]

There's no built-in way to just re-evaluate your showIfs. You could trap all the showIf methods you're registering and run them yourself, or again trap the actual situation in which this field could trigger other fields to be shown or hidden and redraw() only then.

If you'd really prefer to have a method to just re-evaluate showIfs, that would be sponsorable if you've written a lot of logic and don't want to rearrange it.

[martintaal]

I will try to rearrange my logic to put in in the chaged(). But still I think this is a workaround. I mean regardless the logic I implemented, I agree a TextItem with redrawOnChange should redraw the whole form on each keystroke but I also think, after this redraw cursor position and text selection shouldn't change.

Is not this a smarclient bug?

gr. Martin

[martintaal]

Hi,

I tried your proposal: it works a little bit better but not completely fine. Now text selection/cursor position doesn't change on each keystroke, but it does when the other field is shown/hidden because this action forces the form to be redrawn.

You can reproduce it using the code below. Typing hide in any of the fields hides the other one, writing any other thing shows it. If you type hide in first field, text is selected automatically. If you insert h at the beginning of the 2nd one, cursor is moved to the end of the field.

Any idea?

gr. Martin

isc.DynamicForm.create({
    width: 600,
    fields: [
       {name: 't1',
         type: 'text',
         title: 'selectOnFocus true',
         defaultValue: 'Change me...',
         selectOnFocus: true,
         changed: function () {
           var otherItem = this.form.getItem('t2');
           if (this.getValue() === 'hide'){
             otherItem.hide();
           } else {
             otherItem.show();
           }
         }
        },
        {name: 't2',
         type: 'text',
         title: 'selectOnFocus false',
         defaultValue: 'ide',
         selectOnFocus: false,
         changed: function () {
           var otherItem = this.form.getItem('t1');
           if (this.getValue() === 'hide'){
             otherItem.hide();
           } else {
             otherItem.show();
           }
         }
       }
    ]
});

[martintaal]

Any idea/suggestion?

[Isomorphic]

Hi Martin
We've made a change to all three branches (8.1p, 8.2p and 8.3d) to support maintaining the cursor position on redraw (when selectOnFocus is false).
This is probably enough to get things working for you - please try the next nightly build (Feb 22 or greater) and let us know if it works for you.

Regards
Isomorphic Software

[martintaal]

Hi,
Thanks, but I have selectOnFocus to true, so would your change also work in that case?

gr. Martin

[Isomorphic]

Ha! Naturally you're using the trickier to fix case! :)
Yes we should be able to get that resolved as well - ETA early next week

Regards
Isomorphic Software

[martintaal]

Indeed I am :-), thanks!

[martintaal]

Hi,

I've tested again with http://www.smartclient.com/builds/Sm...GPL/2012-03-05. It is fixed for the case of selectOnFocus being false but not for true.

gr. Martin