Table based on radio button selection

[uvelu]

Hi, Based on the radio button selection, table needs to be modified with different headers

Radiobutton A means, table with 3 headers
Radiobutton B means, table with 6 headers

How to acheive this? Can some one help me?

[mongonv (Ed)]

A couple of questions:

1) By headers do you mean columns?

2) If columns, are they always the same 3 and 6 columns or do they need to be dynamically created based on variant data?

[uvelu]

1.Yes.Headers mean columns

2.I need for both the scenarios
i)columns always 3 and 6
ii)columns need to be dynamically created based on variant data

[mongonv (Ed)]

The 3 and 6 issue is relatively easy and can be handled in a number of ways. A couple ways right off that it can be handled are:

1) Use a tabset with hidden headers and switch the active index when a radio button is clicked
2) Have a component file for each layout and load the applicable component file using the load or loadandcache methods when the radio is selected.

The dynamic adding of matrix columns is a lot more complex but completely doable. To add a new column you have to create a new matrix.column object, set its properties, and then either use the matrix adoptchild or insertbefore methods to add the column to the matrix.

If you are using it to edit or some other editmask functionality, you will need to add the create that type of component and attach it to the matrix.column object.

Adding columns dynamically can get very tricky depending on how much you are trying to do with the column. I personally have tried to design the user interface around not having to mess with adding new columns, so have not actually written any code to add columns, just know it can be done.

If you search the forum and learning center there may be an example somewhere of how to dynamically add columns.

Hope that helps,
Ed

[rkoenig]

For dynamic adding of columns you can also use loading of components (oMatrix.loadAndCache()) into the matrix.

Create a column xml with a property set that are the same for each column, and then just set/change the additional properties. If columns are alot different from each other, i have created a small set of columns and load the one that fits best.

[uvelu]

I am veery new to this GI.

How to implement the below solution.

"Use a tabset with hidden headers and switch the active index when a radio button is clicked"

[uvelu]

Is there any sample code for dynamically adding columns to the table?

[mongonv (Ed)]

On setting the active tab you can do something like the following:

- Your project namespace is: myApp
- Your tab set is called: tabbedpane

// Get the tab set
var objTabs = myapp.getJSX("tabbedpane");

// Set the first tab as active
objTabs .setSelectedIndex(0);

// Set the second tab as active
objTabs .setSelectedIndex(1);

Hope that helps,
Ed