Adding and Deleting Columns in UITable App Designer

I have created an example app with app designer where it will output the data from the excel sheet with the UITable. The user must have the ability to delete columns 4-8 via the clicking on the checkbox and then also add them back to there respected locations in the Table as it was originally. For example, the user should be able to uncheck columns 4 and 6, which will delete the column name and the data for those columns out of the table and only display columns 1-3,5,7-13.

The problem I am having is that upon deleting the column such as column 4, it doesn't delete the specified column name, but rather the one at the very end (i.e., column 13) and the data for column 4. From there, all the data from the right side of column 4 from the original table will shift one to the left. The solution here would be so that column 4 variable name and data are deleted but the rest is kept in the table. If the user decides to put the column back in the table, it will simply be by checking the same checkbox and it will come back to where it once was. For example, if column 4 was deleted by unchecking the checkbox, then later on checked, it will return as the fourth column in the table and not at the very end like how I have it in the code currently. Thank you for your help.

Answer 1

[VBBV]

You can modify the function for columnCheckBox Value Changed as below, by using addvars function

 function Column4CheckBoxValueChanged(app, event)
            value = app.Column4CheckBox.Value;
           
            if value == 0
                app.t_final = removevars(app.UITable.Data,4);                
                app.t_final.Properties.VariableNames = ["One","Two","Three","Five","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"];
                app.UITable.ColumnName = app.t_final.Properties.VariableNames;
                app.UITable.Data = (app.t_final)
            elseif value == 1                
               app.t_final = addvars(app.UITable.Data,table2array(app.t_4),'After','Three'); 
               app.t_final.Properties.VariableNames = ["One","Two","Three","Four","Five","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"];
               app.UITable.ColumnName = app.t_final.Properties.VariableNames;
               app.UITable.Data  = app.t_final;
            end
 end

[Ratanjot]

I have tried the code above and everytime I check the column 4 checkbox back on after deselecting it, the Column 13 variable name disappears. As well, how would this work differently if I wanted to uncheck multiple checkboxes at the same time ( such as columns 4-7 are unchecked to make them disappear out of the table but am able to put them back in their respective locations after the checkboxes are checked. Thanks.

[VBBV]

I have tried the code above and everytime I check the column 4 checkbox back on after deselecting it, the Column 13 variable name disappears.

I diagree, Please look at the snanpshots below which i have tested and there doesn't seems to be such problem.

Checkbox Selected

Here's how it looks like after unselecting the checkbox 4

After selecting the checkbox again, the code inserts the column 4 at exactly the same place in the table without any change.

The code can be replicated/ applied for individual and series of checkboxes , say from 4 to 7 like you mentioned.

[VBBV]

BTW, Did you try my code for one of your earlier questions on App designer ? Regarding the sizeChangedFcn ? I have also tested that code and It works fine after modifying the code.

[Ratanjot]

I don't think the code can be replicated for the individual series of checkboxes. For example, in this updated app, the checkboxes for columns 4 and 5 are checked. Once you uncheck both boxes, you will get an error regarding the variable names saying 'The VariableNames property must contain one name for each variable in the table.' Since it is not always certain that I will have columns 5-8 showing when I turn column 4 off, the number of variable names for the table and the number of variables may not match. This is the main issue I am having with the code now. When you had mentioned in the last part of your reply 'After selecting the checkbox again, the code inserts the column 4 at exactly the same place in the table without any change.' It is at this moment that the thirtheenth variable name disappears.

[VBBV]

It is at this moment that the thirtheenth variable name disappears. This is common in most Apps built on App designer, but when you look at final output, the variablename appears again after brief time, for reasons related to UItable operations.

Regarding the series of checkboxes, you can

Try something like for series of checkboxes, but you need to ensure, the checkbox property value to pass between callbacks to check for all states /conditions of checkboxes.

function Column4CheckBoxValueChanged(app, event)
            value4 = app.Column4CheckBox.Value;
           
            if value5 == 0 & value4 == 0   % check whether both checkboxes are unchcked 
                app.t_final = removevars(app.UITable.Data,["Four","Five"]);                
                app.t_final.Properties.VariableNames = ["One","Two","Three","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"];
                app.UITable.ColumnName = app.t_final.Properties.VariableNames;
                app.UITable.Data = (app.t_final);
            elseif value4 == 0  % only checkbox 5
                app.t_final = removevars(app.UITable.Data,"Four");                
                app.t_final.Properties.VariableNames = ["One","Two","Three","Five","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"];
                app.UITable.ColumnName = app.t_final.Properties.VariableNames;
                app.UITable.Data = (app.t_final);
            elseif value4 == 1  & value5 == 0 
               app.t_final = addvars(app.UITable.Data,table2array(app.t_4),'After','Three'); 
               app.t_final.Properties.VariableNames = ["One","Two","Three","Four","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"];                
               app.UITable.ColumnName = app.t_final.Properties.VariableNames;
               app.UITable.Data  = app.t_final;
            elseif value5 == 1 & value4 == 1
                app.t_final = addvars(app.UITable.Data,table2array(app.t_5),'After','Three'); 
               app.t_final.Properties.VariableNames = ["One","Two","Three","Four","Five","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"];                
               app.UITable.ColumnName = app.t_final.Properties.VariableNames;
               app.UITable.Data  = app.t_final;              

            end
        end

        % Value changed function: Column5CheckBox
        function Column5CheckBoxValueChanged(app, event)
            value5 = app.Column5CheckBox.Value;
            if value5 == 0 & value4 == 0   % check whether both checkboxes are unchcked 
                app.t_final = removevars(app.UITable.Data,["Four","Five"]);                
                app.t_final.Properties.VariableNames = ["One","Two","Three","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"];
                app.UITable.ColumnName = app.t_final.Properties.VariableNames;
                app.UITable.Data = (app.t_final);
            elseif value5 == 0  % only checkbox 5
                app.t_final = removevars(app.UITable.Data,"Five");                
                app.t_final.Properties.VariableNames = ["One","Two","Three","Four","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"];
                app.UITable.ColumnName = app.t_final.Properties.VariableNames;
                app.UITable.Data = (app.t_final);
            elseif value5 == 1  & value4 == 0 
               app.t_final = addvars(app.UITable.Data,table2array(app.t_5),'After','Three'); 
               app.t_final.Properties.VariableNames = ["One","Two","Three","Five","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"];                
               app.UITable.ColumnName = app.t_final.Properties.VariableNames;
               app.UITable.Data  = app.t_final;
            elseif value5 == 1 & value4 == 1
                app.t_final = addvars(app.UITable.Data,table2array(app.t_5),'After','Three'); 
               app.t_final.Properties.VariableNames = ["One","Two","Three","Four","Five","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"];                
               app.UITable.ColumnName = app.t_final.Properties.VariableNames;
               app.UITable.Data  = app.t_final;              

            end
        end

[VBBV]

Anyways, your question was related to adding and deleting the data to table in App using checkboxes. Please open a new question, if you have further questions

[Ratanjot]

If I understand correctly, since I have 5 checkboxes, would I need to follow this same method. This would cause for many possible combinations. I thought that there may have been an easier solution to this. But if not then its okay. I appreciate all the help!

Answer 2

[Simon Chan]

Attached is another apporach for your reference.

The modification includes the followings:

(1) Save the original table in the 'UserData' of the uitable.

app.UITable.UserData = app.UITable.Data; 

(2) Assign the column number to 'Tag' of the checkbox for that column. Such as 5 for app.Column5CheckBox

(3) The callback for each checkbox would be almost the same except the name of the checkbox.

The following shows the callback for Column4CheckBox and Column5CheckBox as an example.

% Value changed function: Column4CheckBox
        function Column4CheckBoxValueChanged(app, event)
            value = app.Column4CheckBox.Value;
            idx = ismember(["One","Two","Three","Four","Five","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"],app.UITable.ColumnName);
            idx(str2double(app.Column4CheckBox.Tag))=~value;
            app.UITable.ColumnName = app.UITable.UserData.Properties.VariableNames(idx);
            app.UITable.Data = app.UITable.UserData(:,idx);
        end

        % Value changed function: Column5CheckBox
        function Column5CheckBoxValueChanged(app, event)
            value = app.Column5CheckBox.Value;
            idx = ismember(["One","Two","Three","Four","Five","Six","Seven","Eight","Nine","Ten","Eleven","Twelve","Thirteen"],app.UITable.ColumnName);
            idx(str2double(app.Column5CheckBox.Tag))=~value;
            app.UITable.ColumnName = app.UITable.UserData.Properties.VariableNames(idx);
            app.UITable.Data = app.UITable.UserData(:,idx);            
        end

On the other hand, I set all checkboxes to false when the program start.

[Ratanjot]

Exactly the answer I was looking for. Thanks a lot!!!