Elfinder: Add Custom Checkbox column in listview (not showSelectCheckboxUA)

[ghigio2000]

I would like to have a column of checkboxes in the listview.
I tried using "showSelectCheckboxUA" and it works, but I need to avoid "unselect all" on a filename selection in the listview.
I try to explain better my need.
When the user check the checkbox for a series of files I will display the files-content on a map. While on dblclick on one filename I will open the details of that particular file only.
So when dblclick on a file I do not want to uncheck all those checked.
Hope it is clear.

thanks for your help.

[ghigio2000]

Maybe I have not explained properly, let me try to rephrase my question.
I would like to add in the listview a new column to set a file property.
It is a checkbox that I will use onchecked or onunchecked for my scope.

Hope this is possible, if not please answer me anyway. Thanks, appreciated.

[ghigio2000]

@nao-pon
do you have any suggestion?
Thanks in advance for your help.

[nao-pon]

@ghigio2000 What you want is not to control file selection from other than checkbox?

[ghigio2000]

@nao-pon What I want is to have a checkbox for each file in the listview, that I can check or uncheck as I wish and have an event linked to this click. Nothing to do with the selection.
Something like this

I would like to be able to run a command on a file with just one click, and not with a click to select and then another click to run my command.
It is an HIDE/SHOW layers on a map.

[nao-pon]

@ghigio2000 You can add a check box with the following settings. However, since there are some problems with check box event handling, I will fix it.

uiOptions : {
    cwd : {
        listView : {
            columns : ['perm', 'date', 'size', 'kind', 'sel']
        },
        replacement : {
            sel : function(f, fm) {
                return '<input type="checkbox" class="elfinder-cwd-nonselect elfinder-cwd-list-sel" data-hash="'+f.hash+'"/>';
            }
        }
    }
}

[nao-pon]

@ghigio2000 I fixed a bug. Please try with nightly build with...

bootCallback : function(fm, extraObj) {
    fm.bind('init', function() {
        fm.getUI('cwd').on('click', 'input.elfinder-cwd-list-chk', function() {
            var chk = $(this);
            fm.log([chk.data('hash'), chk.is(':checked')]);
        });
    });
},
uiOptions: {
    cwd: {
        listView : {
            columns : ['url', 'date', 'size', 'kind', 'chk']
        },
        replacement : {
            chk : function(f, fm) {
                return '<input type="checkbox" class="elfinder-cwd-nonselect elfinder-cwd-list-chk" data-hash="'+f.hash+'"/>';
            }
        }
    }
}

[ghigio2000]

Thanks it works but not completely.
1) this checkbox should remember its value for the entire session. So if I check a file, then change folder, when I came back that file must be still checked.
2) It would be perfect, if I can select multiple files and then press once a checkbox to check/uncheck all those selected.
Should I open a new request?
thanks a lot for your work and help.

[nao-pon]

@ghigio2000

1. Please implement it yourself using sessionStorage etc.

2. Calling elfinderInstance.selected() will get an array of hashes of the selected items. Please implement it yourself using this.

[ghigio2000]

@nao-pon I do not find any documentation/explanation of the sessionStorage you mention above.

[nao-pon]

@ghigio2000 elFinder does not use sessionStorage. You need to handle sessionStorage using JavaScript. I'd suggest checking the sessionStorage with 'replacement' and adding the checked attribute as necessary.

[ghigio2000]

@nao-pon

Hi, I almost completed my implementation of these checkbox but testing on mobile they are not showing the tick when checked (it looks like they are disabled, but in reality the bootCallback works).
Can you fix it?
thanks

[nao-pon]

@ghigio2000 Yes, I was able to reproduce the problem. I will fix this.