闪亮的DT,DataTable中的Actionbutton不起作用

时间:2018-08-13 22:03:49

标签: javascript r shiny dt shinyjs

我正在尝试使用导航面板创建此闪亮的应用程序。 navBar上的第一个选项卡将是一个摘要表,在其中我要使第一列的内容可单击并导航至其详细信息选项卡的内容。我已经使文本成为超链接,但是我想知道如何真正使onClick导航起作用。

_______________________更新问题______________________

因此,我根据收到的建议进行了一些更新。我只使用了actionLink()函数和ObserveEvent({updateNavPanel})

似乎主要问题是DT表中的actionLink无法正常工作,但在外部却可以正常工作。也许我只是缺少一些回调函数来让它识别DT中的按钮?

下面是代码:Summary1显示有效的操作链接,Summary2显示DT中无效的操作链接。

---
title: "Fruit Dashboard"
output: 
  flexdashboard::flex_dashboard:
    orientation: columns
    vertical_layout: fill
runtime: shiny
---

```{r global, include=FALSE, echo=FALSE}

# import libraries

library(DT)
library(shiny)
library(tidyverse)
library(shinythemes)
library(shinydashboard)
```

```{r, echo = FALSE}

shinyApp(

  ui <- fluidPage(
    titlePanel("Fruit Dashboard"), 
    theme = shinytheme("united"),
    navlistPanel(id='nav', widths = c(2, 10),
              tabPanel('Summary1', actionLink('apple', 'go to apple')),
             tabPanel('Summary2', dataTableOutput('summary')),
              tabPanel("apple", dataTableOutput('apple')),
              tabPanel("orange", dataTableOutput('orange')),
              tabPanel("watermelon", dataTableOutput('watermelon'))
    )

  ),

  server <- function(input, output, session) {

    observeEvent(input$apple, {

    updateNavlistPanel(session, "nav", 'apple')

  })


    output$summary <- renderDataTable({

      data <- data.frame('Fruit' = c('apple', 'orange', 'watermelon'),
                     'Count' = c(3,4,5)) %>%
        mutate(Fruit = paste0("<a id='", Fruit, "' hrep='#' class='action-button'>", Fruit, "</a>" ))

      table <- datatable(data, escape = FALSE , selection = 'none')

      table
    })

    output$apple <- renderDataTable({

      data <- data.frame('Total#' = 3, 'Organic#'= 2, 'Conventional#'=1)

      table <- datatable(data, escape = FALSE)
      table
    })


    output$orange <- renderDataTable({

      data <- data.frame('Total#' = 4, 'Organic#'= 3, 'Conventional#'=1)

      table <- datatable(data, escape = FALSE)
      table
    })

    output$watermelon <- renderDataTable({

      data <- data.frame('Total#' = 5, 'Organic#'= 2, 'Conventional#'= 3)

      table <- datatable(data, escape = FALSE)
      table
    })
  }
)


```

1 个答案:

答案 0 :(得分:0)

从这里的答案中获得启发:R Shiny: Handle Action Buttons in Data Table

我猜想关键是在DT中创建actionLinks时添加on.click参数,以便单击触发事件。并且on.click还可以为actionLink / button分配唯一的按钮ID。然后在observeEvent中,只需将表达式作为输入$ selected_button。查看下面的完整代码:

---
title: "Fruit Dashboard"
output: 
flexdashboard::flex_dashboard:
   orientation: columns
   vertical_layout: fill
runtime: shiny
---

```{r global, include=FALSE, echo=FALSE}

# import libraries

library(DT)
library(shiny)
library(tidyverse)
library(shinythemes)
library(shinydashboard)

df <- data.frame('Fruit' = c('apple', 'orange', 'watermelon'),
                     'Count' = c(3,4,5))

shinyInput <- function(FUN, len, id, label, ...) {
  inputs <- character(len)

  for (i in seq_len(len)) {
    label <- df$Fruit[i]
    inputs[i] <- as.character(FUN(paste0(id, i),label=label, ...))
  }
  inputs
 }

```

```{r, echo = FALSE}

shinyApp(

  ui <- fluidPage(
    titlePanel("Fruit Dashboard"), 
    theme = shinytheme("united"),
    navlistPanel(id='nav', widths = c(2, 10),
              tabPanel('Summary2', dataTableOutput('summary')),
              tabPanel("apple", dataTableOutput('apple')),
              tabPanel("orange", dataTableOutput('orange')),
              tabPanel("watermelon", dataTableOutput('watermelon'))
    )

  ),

  server <- function(input, output, session) {

    output$summary <- renderDataTable({

      data <- df %>%
        mutate(Fruit = shinyInput(actionLink, nrow(df), 'button_', label = Fruit, onclick = 'Shiny.onInputChange(\"select_button\",  this.id)' ))

  table <- datatable(data, escape = FALSE , selection = 'none')

  table
    })

observeEvent(input$select_button, {
   selectedRow <- as.numeric(strsplit(input$select_button, "_")[[1]][2])

  updateNavlistPanel(session, 'nav', df[selectedRow, 1])
})

output$apple <- renderDataTable({

  data <- data.frame('Total#' = 3, 'Organic#'= 2, 'Conventional#'=1)

  table <- datatable(data, escape = FALSE)
  table
})


output$orange <- renderDataTable({

  data <- data.frame('Total#' = 4, 'Organic#'= 3, 'Conventional#'=1)

  table <- datatable(data, escape = FALSE)
  table
})

output$watermelon <- renderDataTable({

  data <- data.frame('Total#' = 5, 'Organic#'= 2, 'Conventional#'= 3)

  table <- datatable(data, escape = FALSE)
  table
    })
  }
)


```