How to render grid with radiobuttons

[phunhuan]

Hi,

I am completely new to the OpenLaszlo framework, and in the processing of learning about how to program with LZX language. I don't know if this is the right group for me to post this question.

Question:
I have created a very simple app containing a grid and a static dataset which the grid used to display. My question is that how can I render the gridtext content to display the radiobuttons with right selection (Male or Female)? In other word, if the sex is 'Male', I want the radiobuttons with the label Male is selected and the radiobutton with the label Female is NOT select.

Thanks in advance.

Here is a sample program:

<canvas width="100%" height="100%" bgcolor="#e0e0e0" debug="false">
<dataset name="dsPeople">
<people>
<person>
<name>John Doe</name>
<sex>Male</sex>
</person>
<person>
<name>Jane Doe</name>
<sex>Female</sex>
</person>
<person>
<name>Mary Smith</name>
<sex>Female</sex>
</person>
<person>
<name>Charles Brown</name>
<sex>Male</sex>
</person>
</people>
</dataset>

<window width="540" height="300"
resizable="false" title="Testing Grid"
bgcolor="#e0e0e0">

<handler name="oninit">
var width = parent.width;
var height = parent.height;
center(width, height);
</handler>

<method name="center" args="w,h">
var msg = 'width: ' + w + ' height: ' + h;
var posX = (w / 2) - (this.width / 2);
var posY = (h / 2) - (this.height / 2);
this.setAttribute("x", posX);
this.setAttribute("y", posY);
</method>

<simplelayout axis="y" spacing="10" />
<view height="20">
<text fontsize="20">People Dataset</text>
<handler name="oninit">
var posX = (parent.width / 2) - (this.width / 2);
var posY = (parent.height / 2) - (this.height / 2);
this.setAttribute("x", posX);
this.setAttribute("y", posY);
</handler>
</view>

<view id="tableContainner" width="100%" height="290">
<grid name="table" width="100%" height="290"
datapath="dsPeople:/people"
contentdatapath="person"
showhlines="true"
showvlines="false"
bgcolor0="#cfcfcf"
bgcolor1="white">

<!- Name column -->
<gridtext width="370" resizable="false" sortable="false">Name
<text datapath="name/text()" />
</gridtext>

<!-- Sex column -->
<gridtext width="130" resizable="false" sortable="false"
datapath="enabled/text()">Sex
<radiogroup name="sex" x="10" y="3" layout="axis:'x'">
<handler name="oninit">
var h = this.parent.height - 6;
var x = this.parent.width / 2 - this.width / 2;
var y = 5;
this.setAttribute("height", h);
this.setAttribute("x", x);
this.setAttribute("y", y);
</handler>
<radiobutton name="male" value="0" text="Male" />
<radiobutton name="female" value="1" text="Female" />
</radiogroup>
</gridtext>
</grid>
</view>
</window>
</canvas>

[phunhuan]

Sorry I that the code in previous thread contains the error in the comment at the Name column. Just replace it with <!-- --> or remove that coment and it will run.

[cayres]

You can possibly get the effect you want by using an attribute set to the value of the 'sex' field in your data. Something like:<!-- Sex column -->
<gridcolumn width="130" resizable="false" sortable="false" text="Sex">
<radiogroup name="sex" x="10" y="3" layout="axis:'x'">
<attribute name="sexdesc" type="string" value="$path{'sex/text()'}"/>
<radiobutton name="male" value="0" text="Male" selected="${parent.sexdesc=='Male'}"/>
<radiobutton name="female" value="1" text="Female" selected="${parent.sexdesc=='Female'}"/>
</radiogroup>
</gridcolumn>

[phunhuan]

Thank you *VERY* much for your help cayres! It works.

I just started learning about this OpenLaszlo about 4 days ago, and I guess I still have a lot of things to pick up.

Once again, thank you for your help.