Show / Hide Columns – Listed horizontally

[rafmouraMember]

Hello! Sorry my English, I speak Portuguese and I’m not very good at English.

Let’s go the problem:

I can make the Grid a Show / Hide Columns with the items listed horizontally? I made a montage showing how the MSPaint would like to stay.

https://lh4.googleusercontent.com/-0wPqgXKIPlY/UaX5nuKy2zI/AAAAAAAAAM4/QUM5B-4lUVg/w606-h520-no/grid.jpg

Thank you!

[Peter StoevKeymaster]

Hi,

You can use multiple instances of the jqxCheckbox widget if you want horizontal representation. Then you can trigger the “change” event. In the event handler, use the Grid’s “showcolumn” and “hidecolumn” methods to dynamically show/hide columns.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[rafmouraMember]

Sorry, I didn’t understand. In which part of my code I have to make this change?

var listSource = [{ label: 'SM', value: 'SolicitacaoMonitoramentoId', checked: true },
                              { label: 'Status', value: 'Status', checked: true },
                              { label: 'Origem', value: 'Origem', checked: true },
                              { label: 'Placa', value: 'Placa', checked: true },
                              { label: 'Previsão de Início', value: 'PrevisaoInicio', checked: true },
                              { label: 'Início da Viagem', value: 'DataIniciado', checked: true },
                              { label: 'Previsão de Término', value: 'PrevisaoTermino', checked: true }];
            $("#jqxlistbox").jqxListBox({ source: listSource, width: '450px', height: '100px', checkboxes: true });
           
            $("#jqxlistbox").on('checkChange', function (event) {
                if (event.args.checked) {
                    $("#gridViagens").jqxGrid('showcolumn', event.args.value);
                }
                else {
                    $("#gridViagens").jqxGrid('hidecolumn', event.args.value);
                }
            });

[Author]

Posts