Hi Martin,

Thanks for the reply - I did not look at it in details right now (quite
busy) but I will try when i get a chance.

I hope you are better :) I have one more quite urgent question right now,
will ask that in other mail.

On Mon, Jun 15, 2009 at 3:15 PM, Martin Wittemann <[email protected]
> wrote:

> Hello Jean-Noel,
> first of all sorry for the late answer. I was due to health problems not at
> work so i could not reply.
>
> I have to admit I thought of something different of your problem. But with
> your current code sample i saw what you try to achieve.
> But your current solution does not use the data binding at all so in the
> context of data binding its not elegant. ;)
>
> But i do have a solution for your problem, which you can give a try in the
> playground.
>
> // create the radio buttons
> var left = new qx.ui.toolbar.RadioButton("Left");
> var right = new qx.ui.toolbar.RadioButton("Right");
> var centered = new qx.ui.toolbar.RadioButton("Centered");
> var justified = new qx.ui.toolbar.RadioButton("Justified");
>
> // add the radio buttons
> this.getRoot().add(left, {left: 10, top: 10});
> this.getRoot().add(right, {left: 50, top: 10});
> this.getRoot().add(centered, {left: 90, top: 10});
> this.getRoot().add(justified, {left: 150, top: 10});
>
> // create the radio group and add the buttons
> var group = new qx.ui.form.RadioGroup();
> group.add(left, right, centered, justified);
>
> // create a dummy class
> qx.Class.define("qx.testClass", {
>   extend : qx.core.Object,
>   properties : {
>     textAlign : {
>       event : "changeTextAlign",
>       init : "Left"
>     }
>   }
> });
>
> // create a instance of the test class
> var test = new qx.testClass();
>
> // create a converter for the binding
> var options = {
>   converter : function(data) {
>     return data[0].getLabel();
>   }
> };
> // bind the selection of the radio group to the dummy class
> group.bind("changeSelection", test, "textAlign", options);
>
>
>
> As you can see, the magic in this case is in the converter. You use the
> selection and bind this event to the target property. In the converter, you
> can access the selection object, which is an array of radio buttons
> containing the one selected radio button, and return the value which should
> be stored in the property. I just used the label of the buttons. But if you
> want some different data, you can use qooxdoo user data (setUserData and
> getUserData). Using the value of the form elements is not a good idea
> because the will be deprecated in the next release (already are in trunk).
>
> Is that such a solution you were seeking?
>
> Best,
> Martin
>
> Am 22.05.2009 um 18:06 schrieb Jean-Noël Rivasseau:
>
> Hi Martin,
>
> I think you misunderstood my problem, because the code you suggested *does
> not make sense at all to me* (or maybe I really did not get what you wrote).
> Why binding a list???!
>
> Thanks for letting me know that binding a radio group is not officially
> supported. However, if you are dealing with a non nullable property and
> qx.ui.form.RadioButton, it actually *Just Works*. Look at the following
> code:
>
> textAlignment: {"init": "LEFT", "event": "changeTextAlignment", "check":
> ["LEFT", "RIGHT", "CENTERED", "JUSTIFIED"], "apply": "_applyTextAlignment"},
>
>         var left = new qx.ui.form.RadioButton("Left");
>         var right = new qx.ui.form.RadioButton("Right");
>         var centered = new qx.ui.form.RadioButton("Centered");
>         var justified = new qx.ui.form.RadioButton("Justified");
>
>         left.setValue("LEFT");
>         right.setValue("RIGHT");
>         centered.setValue("CENTERED");
>         justified.setValue("JUSTIFIED");
>         this.textAlignmentRadioGroup = new qx.ui.form.RadioGroup();
>         this.textAlignmentRadioGroup.add(left, right, centered, justified);
>
>         var controller = new qx.data.controller.Object(this);
>         controller.addTarget(this.textAlignmentRadioGroup, "value",
> "textAlignment", true);
>
> This works perfectly. However the problem comes when you want to have a
> nullable property. Let's change the code to:
>
> textAlignment: {"nullable": true,"init": null, "event":
> "changeTextAlignment", "check": ["LEFT", "RIGHT", "CENTERED", "JUSTIFIED"],
> "apply": "_applyTextAlignment"},
>
>         var left = new qx.ui.toolbar.RadioButton("Left");
>         var right = new qx.ui.toolbar.RadioButton("Right");
>         var centered = new qx.ui.toolbar.RadioButton("Centered");
>         var justified = new qx.ui.toolbar.RadioButton("Justified");
>
> // Note how we changed all the qx.ui.form.RadioButton to
> qx.ui.toolbar.RadioButton
>
>         left.setValue("LEFT");
>         right.setValue("RIGHT");
>         centered.setValue("CENTERED");
>         justified.setValue("JUSTIFIED");
>         this.textAlignmentRadioGroup = new qx.ui.form.RadioGroup();
>         this.textAlignmentRadioGroup.add(left, right, centered, justified);
>
>         var controller = new qx.data.controller.Object(this);
>         controller.addTarget(this.textAlignmentRadioGroup, "value",
> "textAlignment", true);
>
> Then this wont work because value can not be resetted, for a
> qx.ui.form.RadioGroup. I basically had to code the following to do what I
> wanted (I removed the controller.addTarget(this.textAlignmentRadioGroup,
> "value", "textAlignment", true) code too):
>
>             textPage.textAlignmentRadioGroup.addListener("changeSelected",
> this.processTextAlignmentDataBinding, this);
>
>         processTextAlignmentDataBinding: function()
>         {
>             var selection = this.textAlignmentRadioGroup.getSelected();
>
>             if (selection)
>             {
>                 this.setTextAlignment(selection.getValue());
>             }
>             else
>             {
>                 this.resetTextAlignment();
>             }
>         },
>
>         _applyTextAlignment: function()
>         {
>
>                 var selection = this.getTextAlignment();
>
>                 if (selection)
>                 {
>                     this.textAlignmentRadioGroup.setValue(selection);
>                 }
>                 else
>                 {
>                     this.textAlignmentRadioGroup.resetSelected();
>                 }
>
>         },
>
> So I got it working (what do you think, is it an elegant way to solve the
> problem ?). But it would be nice if such stuff was integrated and
> documented.
>
> Thanks
>
> Jean-Noel
>
> On Mon, May 18, 2009 at 9:48 AM, Martin Wittemann <
> [email protected]> wrote:
>
>> Hello Jean-Noel,
>>
>> thanks or the flowers for my last suggestion. I'll do my best. :)
>>
>> Looks like you are one step ahead of me with your current problem. I
>> have thought about binding radio buttons and a radio group but havent
>> testet it yet. So officially it is not supported by the current data
>> binding layer.
>>
>> I guess what you are looking for is something like a binding of a
>> form. We are currently working towards such a dynamic form widget
>> including the whole data binding. The first step was to get the form
>> API right. So if you want to be informed of the status of the form
>> controller, you can add yourself as cc in the bug report here:
>> http://bugzilla.qooxdoo.org/show_bug.cgi?id=2295
>>
>> But you dont have a big problem i guess. ;) I have found a workaround
>> which might be not really an elegant way but its working. You can use
>> the list controller and a list widget as a container for the
>> RadioButtons from the form namespace.
>> Just test the following code in the playground and see how it could
>> work:
>>
>> var list = new qx.ui.form.List();
>> list.setAppearance("");
>> this.getRoot().add(list);
>>
>> var data = new qx.data.Array("a", "b", "c", "d", "e");
>>
>> var radioGroup = new qx.ui.form.RadioGroup();
>>
>> var controller = new qx.data.controller.List(data, list);
>>
>> var delegate = {
>>   createItem : function() {
>>     var item = new qx.ui.form.RadioButton();
>>     radioGroup.add(item);
>>     return item;
>>   },
>>
>>   bindItem : function(controller, item, id) {
>>     controller.bindProperty(null, "label", null, item, id);
>>   }
>> };
>>
>> controller.setDelegate(delegate);
>>
>>
>> You have to handle the selection of the group with the RadioGroup
>> object itself because the selection of the controller does not work.
>> I hope that will work for you?
>>
>> Best,
>> Martin
>>
>>
>>
>> Am 15.05.2009 um 20:29 schrieb Jean-Noël Rivasseau:
>>
>> > Hi,
>> >
>> > I am sure Martin will come up with a clever solution to my
>> > problem ;)  - his last suggestions worked perfectly.
>> >
>> > I have not been able to make data binding work with a RadioGroup
>> > containing radio buttons. My problem is the following:
>> >
>> > I have a value, that is nullable, that can take a set of predefined
>> > values. I want it to be bound to the GUI in the form of a radio
>> > group. My first problem is that the default qx.ui.form.RadioButton
>> > does not allows for null values from an interface point of view (you
>> > cannot click on a button to toggle it off).
>> > qx.ui.toolbar.RadioButton allows that though.
>> >
>> > So I have set up 4 qx.ui.toolbar.RadioButton that are linked to a
>> > qx.ui.form.RadioGroup. Now I dont know how to setup the data
>> > binding; what value should I bind to in the widget? I tried binding
>> > to "changeSelection" and it does not work. I get:
>> >
>> > target["set" + qx.lang.String.firstUp(lastProperty)] is not a function
>> >
>> > I tried binding to value and it works better (although I should not
>> > use value; it is marked deprecated in the qx.ui.form.RadioGroup
>> > API). But it's still not perfect because it does not allow nulls
>> > (when I unselect a toggle button, I get:
>> >
>> > target["reset" + qx.lang.String.firstUp(lastProperty)]
>> >
>> > The reset function indeed is not defined for the value property in
>> > the current qx.ui.form.RadioGroup API.
>> >
>> > I also tried to use qx.ui.form.RadioButton instead of
>> > qx.ui.toolbar.RadioButton. It does not work either, eg, I dont know
>> > to which property / event I should bind on the RadioGroup.
>> >
>> > So what's the proper, current, non deprecated way of doing what I
>> > need? Or is the RadioGroup widget not yet suitable to data binding,
>> > which would be a real problem ;)
>> >
>> > Thanks
>> >
>> > Jean-Noel
>> >
>> ------------------------------------------------------------------------------
>> > Crystal Reports - New Free Runtime and 30 Day Trial
>> > Check out the new simplified licensing option that enables
>> > unlimited royalty-free distribution of the report engine
>> > for externally facing server and web deployment.
>> >
>> http://p.sf.net/sfu/businessobjects_______________________________________________
>> > qooxdoo-devel mailing list
>> > [email protected]
>> > https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>>
>>
>>
>> ------------------------------------------------------------------------------
>> Crystal Reports - New Free Runtime and 30 Day Trial
>> Check out the new simplified licensing option that enables
>> unlimited royalty-free distribution of the report engine
>> for externally facing server and web deployment.
>> http://p.sf.net/sfu/businessobjects
>> _______________________________________________
>> qooxdoo-devel mailing list
>> [email protected]
>> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>>
>
>
>
> --
> Jean-Noël Rivasseau
> Shoopz - Lead Developer / Responsable Développement
> http://www.shoopz.com/
>
> ------------------------------------------------------------------------------
> Register Now for Creativity and Technology (CaT), June 3rd, NYC. CaT
> is a gathering of tech-side developers & brand creativity professionals.
> Meet
> the minds behind Google Creative Lab, Visual Complexity, Processing, &
> iPhoneDevCamp asthey present alongside digital heavyweights like Barbarian
> Group, R/GA, & Big Spaceship. 
> http://www.creativitycat.com_______________________________________________
> qooxdoo-devel mailing list
> [email protected]
> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>
>
>
>
> ------------------------------------------------------------------------------
> Crystal Reports - New Free Runtime and 30 Day Trial
> Check out the new simplified licensing option that enables unlimited
> royalty-free distribution of the report engine for externally facing
> server and web deployment.
> http://p.sf.net/sfu/businessobjects
> _______________________________________________
> qooxdoo-devel mailing list
> [email protected]
> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>
>
------------------------------------------------------------------------------
Crystal Reports - New Free Runtime and 30 Day Trial
Check out the new simplified licensing option that enables unlimited
royalty-free distribution of the report engine for externally facing 
server and web deployment.
http://p.sf.net/sfu/businessobjects
_______________________________________________
qooxdoo-devel mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel

Reply via email to