文章/答案/技术大牛

发布

社区首页 >问答首页 >R Shiny使用javascript回调滚动到datatable的给定行

问R Shiny使用javascript回调滚动到datatable的给定行
EN

Stack Overflow用户

提问于 2017-12-21 01:46:00

回答 2查看 1.3K关注 0票数 5

我遇到了数据表和闪亮的问题，特别是在flexdashboard中，但我认为这是无关紧要的。

当我单击绘图中的相应点时，我想滚动到数据表中的给定行。但是，我遇到的最小问题是“简单地”滚动到任何一行。我可以使用带有initComplete选项的JavaScript选择一行，但是scrollTo()不会为我做任何事情。

看一下前面的问题Scroll to specific row in Datatable API，我得到了这个例子https://codepen.io/anon/pen/KWmpjj。它展示了可以与initComplete一起使用的javascript函数，但这不是用R/Shiny创建的。具体来说，您将发现以下用于小型datatable的选项：

initComplete: function () {
        this.api().row(14).scrollTo();
      $(this.api().row(14).node()).addClass('selected');
    }

因为我的目标是在flexdashboard中使用它，所以我有一个R markdown格式的最小示例。使用随机数据对DT::renderDataTable进行非常标准的调用。我不明白为什么this.api().table().row(15).scrollTo();什么都不做。我添加了一个警报，以确认initComplete的JavaScript确实运行了。

---
title: "Scroll to row in datatable"
date: "20 december 2017"
output: html_document
runtime: shiny
---

```{r setup, include=FALSE}

knitr::opts_chunk$set(echo =真)

## Datatable automatically scroll to given row
The goal is to have a datatable rendered in a flexdashboard. Upon selecting a point in a scatter plot, the corresponding row in the table gets selected and needs to be scrolled into view. Selecting a row by clicking a point in a plot (with ggplot) works, but scrolling will not.

Preferably without using shinyApp(), since scrolling is a JavaScript functionality rather than a shiny one (?).

```{r}

库(Dplyr)

库(DT)

生成随机数据

df <- data.frame(矩阵(runif(1000)，ncol = 5))

使用shiny呈现datatable

DT::renderDataTable({

DT::datatable(df，

extensions = 'Scroller'，

selection = ' single '，#最终只允许单选

转义= FALSE，

callback = JS('this.api().row(15).scrollTo();')，#尝试使用回调

选项=列表(scrollX= TRUE，

             scrollY = 200,

             paging = FALSE,

             initComplete  = JS('function() {

                               $(this.api().table().row(15).node()).addClass("selected");

                               this.api().table().row(15).scrollTo();

                              alert("scrolled");}')))},

server = TRUE) #设置server = TRUE将导致选择initComplete中断

我注意到，如果在previously linked example中滚动表格，底部的文本实际上会更新并显示“显示20个条目中的1到6个条目”或“显示20个条目中的6到11个条目”，等等。这让我认为它不会滚动到指定的行，因为所有的东西都已经“在视图中”了，即使它不是真的。

shiny

javascript

scroll

datatable

回答 2

Stack Overflow用户

回答已采纳

发布于 2019-06-27 06:53:03

我不知道为什么DataTable的.scrollTo()方法不能工作，但我刚刚在HTML节点上测试了原生.scrollIntoView()方法，它对我来说工作得很好。我改变了你的

this.api().table().row(15).scrollTo();

至

this.api().table().row(15).node().scrollIntoView();

完整示例：

---
title: "Scroll to row in datatable"
date: "20 december 2017"
output: html_document
runtime: shiny
---

```{r setup, include=FALSE}

knitr::opts_chunk$set(echo =真)

## Datatable automatically scroll to given row
The goal is to have a datatable rendered in a flexdashboard. Upon selecting a point in a scatter plot, the corresponding row in the table gets selected and needs to be scrolled into view. Selecting a row by clicking a point in a plot (with ggplot) works, but scrolling will not.

Preferably without using shinyApp(), since scrolling is a JavaScript functionality rather than a shiny one (?).

```{r}

库(Dplyr)

库(DT)

生成随机数据

df <- data.frame(矩阵(runif(1000)，ncol = 5))

使用shiny呈现datatable

DT::renderDataTable({

DT::datatable(df，

extensions = 'Scroller'，

selection = ' single '，#最终只允许单选

转义= FALSE，

callback = JS('this.api().row(15).scrollTo();')，#尝试使用回调

选项=列表(scrollX= TRUE，

             scrollY = 200,

             paging = FALSE,

             initComplete  = JS('function() {

                               $(this.api().table().row(15).node()).addClass("selected");

                               this.api().table().row(15).node().scrollIntoView();

                              }')))},

server = TRUE) #设置server = TRUE将导致选择initComplete中断

票数 3

Stack Overflow用户

发布于 2018-03-10 10:38:19

您需要在datatable() options参数中设置scroller = TRUE和paging = TRUE。这对我很有效：

---
title: "Scroll to row in datatable"
date: "20 december 2017"
output: html_document
runtime: shiny
---

```{r setup, include=FALSE}

knitr::opts_chunk$set(echo =真)

## Datatable automatically scroll to given row
The goal is to have a datatable rendered in a flexdashboard. Upon selecting a point in a scatter plot, the corresponding row in the table gets selected and needs to be scrolled into view. Selecting a row by clicking a point in a plot (with ggplot) works, but scrolling will not.

Preferably without using shinyApp(), since scrolling is a JavaScript functionality rather than a shiny one (?).

```{r}

库(Dplyr)

库(DT)

生成随机数据

df <- data.frame(矩阵(runif(1000)，ncol = 5))

使用shiny呈现datatable

DT::renderDataTable({

DT::datatable(df，

extensions = 'Scroller'，

selection = ' single '，#最终只允许单选

转义= FALSE，

callback = JS('this.api().row(15).scrollTo();')，#尝试使用回调

选项=列表(scrollX= TRUE，

             scrollY = 200,

             paging = TRUE,

             scroller = TRUE,

             initComplete  = JS('function() {

                               $(this.api().table().row(15).node()).addClass("selected");

                               this.api().table().row(15).scrollTo();

                              alert("scrolled");}')))},

server = TRUE) #设置server = TRUE将导致选择initComplete中断

票数 4

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/47911673

复制

相似问题

问R Shiny使用javascript回调滚动到datatable的给定行
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问R Shiny使用javascript回调滚动到datatable的给定行EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问R Shiny使用javascript回调滚动到datatable的给定行
EN