Is there any way to select a row when DT is working on server side?

[Max Moro]

I'm using DT to show a big list of data (10,000 rows, 20 cols) and the process is much faster when I use the server=TRUE option.

With server=TRUE is not possible to select rows because are lost when the page is changed. But, is there a way to select only 1 row? (single-select instead of multi-select)

This will allow the user to select one row and activate an action related to that row. 

I've a JS code that worked with the standard renderdatatable, but it is not working with DT

JS("function(table) {

                                        table.on('click.dt', 'tr', function() {

                                          if ( $(this).hasClass('selected') ) {

                                            $(this).removeClass('selected');

                                          }

                                          else {

                                            table.$('tr.selected').removeClass('selected');

                                            $(this).addClass('selected');

                                          }

                                          Shiny.onInputChange('tbl_sel',

                                          table.rows('.selected').data().toArray());

                                        });}")

Is there a way to change this to make it work with DT? or can DT do a single-select on server side?... or any other idea to select a row when the table is server-side?

Thank you very much for your help!

Max

[Tom Francis]

Hi,

Did you find a solution for this?

thx,

Tom

[Max Moro]

Not yet, I hope someone can jump in with some cool idea :)

Here the code I'm using to test, pls edit as needed.

The goal is to gather the selected row when DT is working Server-Side

library(shiny)

library(data.table)

data=data.table(mtcars)

shinyApp(

    ui = fluidPage(

        title = 'Server-side processing of DataTables'

        ,fluidRow(DT::dataTableOutput('tbl'))

        ,fluidRow(textOutput('log'))

    ),

    server = function(input, output, session) {

        data=appendCheckboxes(data,after = FALSE)

        output$tbl = DT::renderDataTable(

            datatable(data

                      ,server=TRUE

                      ,escape=FALSE

                      ,options=list(ajax = list(url = dataTableAjax(rowname=TRUE, session, data)))

            )

            )

        output$log=renderText(paste('Rows selected:',paste(input$tbl_selected,collapse=',')))

    }

)

[Max Moro]

I'm sorry to bother again on this topic, I'm look for a way to select a record when DT is on server=TRUE mode.

DT is fantastic, but selecting at one of the visible records is key for many applications that have a big quantity of data displayed to the user.

Any help is very welcome.

Thanks

Max

[Max Moro]

Yeah! I found the solution understanding how the JS function works.

This code allows the user to select one row and shows its ID at the bottom. Pay attention, the selection is not visible on the table when the user changes page, this is because of the server side process. But at least you can have a reaction also on this situation.

I also have a code for multi-select, but it is making less sense when working on server side. Let me know if you need it.

Max

## DT Server Side

library(shiny)

library(DT)

library(data.table)

ID=seq(1,nrow(mtcars))

data=data.table(ID,mtcars)

shinyApp(

    ui = fluidPage(

        title = 'Server-side processing of DataTables, with Row Selector'

        ,fluidRow(uiOutput('info'))

        ,fluidRow(DT::dataTableOutput('tbl'))

        ,fluidRow(textOutput('log'))

        ,fluidRow(uiOutput('link'))

    ),

    server = function(input, output, session) {

        

        output$info=renderUI(h2('DT table Server Side with Row Selector'))

        

        output$tbl = DT::renderDataTable(

            datatable(data

                      ,server=TRUE

                      ,escape=FALSE

                      ,rownames = FALSE

                      ,options=list(

                          ajax = list(url = dataTableAjax(rowname=FALSE, session, data))  #must be present if server side, must have the 'data' frame used for the table

                      )

                      ,callback = JS(

                          "table.on('click.dt', 'tr', function() {

                                if ( $(this).hasClass('selected') ) {

                                    $(this).removeClass('selected');

                                }

                                else {

                                    table.$('tr.selected').removeClass('selected');

                                    $(this).addClass('selected');

                                }

                                Shiny.onInputChange('tbl_selected',

                                    table.rows('.selected').data().toArray());

                    });")

            )

        )

        output$link=renderUI(a('Documentation',href='https://rstudio.github.io/DT/server.html'))

        output$log=renderText(paste0('ID selected: ',paste(input$tbl_selected[1],collapse=',')))

    }

)

[Yihui Xie]

Hi,

Finally I managed to make row selection work for the server-side
processing mode as well. Please update DT from Github, and see Section
2.1: http://rstudio.github.io/DT/shiny.html

Regards,
Yihui

[Max Moro]

Thank you very much Yihui!

The new feature looks awesome!

Max

[Max Moro]

Hi Yihui,

can you help me to see  why the selection is not working with the Scroller enabled? I can only select the odd rows (1,3,5).. not the even (2,4..etc.) I think I'm setting some parameter wrong

library(shiny)

library(data.table)

library(DT)

data=data.table(mtcars)

shinyApp(

    ui = fluidPage(

        title = 'Template'

        ,fluidRow(uiOutput('info'))

        ,fluidRow(DT::dataTableOutput('tbl'))

        ,fluidRow(textOutput('log'))

        ,fluidRow(uiOutput('link'))

    ),

    server = function(input, output, session) {

        

        output$info=renderUI(h2('DT table with Row Selector, Table Tools, Scroller, Column Selector (Client Side)'))

        

        output$tbl = DT::renderDataTable({

            #data=appendCheckboxes(data,after = FALSE)

            datatable(data

                      ,server=FALSE

                      ,escape=FALSE

                      ,extensions = c('TableTools','ColVis','Scroller')

                      ,rownames = FALSE

                      ,filter = "bottom"  #filter must be at bottom if there is Scroller

                      ,options=list(

                          dom='iTC<"clear">frtS'  #C<"clear">=Column Selecter  S=Scroller  T=TableTools

                          ,scrollY='300px'

                          ,scrollX=TRUE

                          ,deferRender=FALSE

                          ,tableTools = list(sSwfPath = copySWF('www')

                                             ,aButtons = list('copy', 'print','xls') #must have copy_csv_xls.swf in www dir

                          )

                      )

            )

        })

        

        output$log=renderText(paste0('Rows selected: ',paste(input$tbl_selected,collapse=',')))

        

        output$link=renderUI(a('Documentation',href='https://rstudio.github.io/DT/shiny.html'))

    }

)

Thanks

Max

On Monday, May 25, 2015 at 2:43:57 PM UTC-6, Yihui Xie wrote:

[Yihui Xie]

The fact is that the even rows are selected, but for some reason the
rows are not highlighted. Sounds like the Scroller extension has a
conflicting CSS style somewhere. I'll investigate. Thanks!

Regards,
Yihui

[Yihui Xie]

Okay, figured it out, and fixed in the latest development version. Thanks!

Regards,
Yihui

[Max Moro]

Yes! It is working now, Thank you very much

Max