Tips and tricks #11: Dynamic table columns
This article describes how to work with dynamic columns in your calculator
This page exists due to the efforts of the following people:
 | Timur
|
Tips and tricks series
- Tips and tricks #1: How to set output value
- Tips and tricks #2: How to make calculator translatable into different languages
- Tips and tricks #3: How to make calculator with custom errors
- Tips and tricks #4: How to make calculator with table output
- Tips and tricks #5: How to show/hide input and output controls in a calculator
- Tips and tricks #6: How to make calculator with virtual keyboard
- Tips and tricks #7: How to make calculator with SVG image map
- Tips and tricks #8: How to reuse existing calculator
- Tips and tricks #9: Big numbers
- Tips and tricks #10: Files, long calculation mode
- Tips and tricks #11: Dynamic table columns
- Tips and tricks #12: Long (infinite) calculations
- Tips and tricks #13: Bitmaps and Pixel manipulation
- Tips and tricks #14: How to use a masked input
This article may rely on knowledge you should get from previous articles, so you may want to check them first.
Using calculator editor UI, you can create an output table. However, it assumes that you do know table columns in advance. If you don't you need to add them programmatically. To make it easy, table output supports column cloning operation. So, the idea is - add columns that will serve as models for your dynamic columns, hide them from the final view, and use clone operation to add new columns unknown beforehand. Well, of course, it is assumed that new columns somehow depend on input data. Below is the example calculator, where the number of columns in the output table depends on the number of rows in the input table.
Here is the code snippet. Note that it is used in the Display function of calculator, which tailors the controls, not the Calculate function, which does the calculations:
resultTable.DisplayColumn("model",false);
sets.GetValue().forEach(function(item, i) {
cloneColumn( i, item.label );
});
function cloneColumn( id, name ) {
resultTable.CloneColumn( "model","set"+id, name);
resultTable.DisplayColumn("set"+id,true);
}Line 1 hides the model column from the view (note that to hide column from the chart, you should use DisplaySeries function).
Lines 2-4 use input object "sets" to get data and create new columns based on this data. "sets" data is array, so for each item in the array new column is created using cloneColumn function
Line 7 clones column by calling CloneColumn function on output object "resultTable", which represents, well, result table.
Line 8 shows the newly cloned column.
Combinations generator
Sets
| Label | Set | ||
|---|---|---|---|
Comments