Textinput 2ways binding

How-to Discussions
1

Hi guys,

I’ve a EACH iteration in the ux, on an observable array. One of the property is bound to a Textinput. A button internal to each item calls an handler, where the sender contains the datacontext of the clicked item. All ok till here.

The ugly thing is that the object property bound to the Textinput doesn’t change as expected, I mean in the datacontext I get the old value not reflecting what has been typed.

Is this the behaviour by design? I hope it isn’t.

Thanks Max

2

Hi!

It is not guaranteed that the observable bound to Value is updated before the ValueChanged event is fired - the order is undefined.

To be sure you should use e.value on the event argument passed to ValueChanged instead of inspecting the observable.

3

Could it be that the property bound to the TextInput isn’t itself Observable?

Is this similar to what you’re describing? Here the txtIn property is observable and the handler prints the correct (updated) value.

    <App Theme="Basic">
        <DockPanel>
            <JavaScript>
                var Observable = require("FuseJS/Observable");

                items = Observable();
                for(var i=0; i < 3; i++) items.add({txtIn: Observable("foo "+i)});

                function handler(arg){ console.log(arg.data.txtIn.value);}

                module.exports = {items: items, handler: handler};
            </JavaScript>

            <StackPanel>
                <Each Items="{items}">
                    <DockPanel>
                        <Button Text="OK" Clicked="{handler}" Dock="Right"/>
                        <TextInput Value="{txtIn}"/>
                    </DockPanel>
                </Each>
            </StackPanel>
        </DockPanel>
    </App>
4

Thank you vm for your replies. Anders, you mean to intercept the valuechanged, read the value and overwrite the same object property? Does the valuechanged fires from view to model or even the way back? I’ll try and let you know.

Remi probably it works (as it worked for me in another case where the property was itself a single observable) but I think it is not that scalable solution.

Max

5

Max: I am a little confused by your questions. Please paste some code so we can see what you are actually doing/trying to do.

6

Anders indeed you have understood very well and I have applied succesfully your previous suggestion using valuechanged event, it works.

Thanks Max