jquery – 在RStudio闪亮,希望自定义一个表

前端之家收集整理的这篇文章主要介绍了jquery – 在RStudio闪亮,希望自定义一个表前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
在一个带有由renderTable()生成的表的RStudio闪亮应用程序中,我想添加一个前导列的单选按钮(当然是被动的)并更改所选行的样式.什么是最好的策略?我想如果绝对必要的话我可以使用jQuery,但是不是更简单的方法吗?我已经尝试将html插入到renderTable()表达式中的表格单元格args …不起作用.

解决方法

不确定你是否还在寻找答案.可能不是,但是看到它没有答案让我很难过.我只想自己创建表格html并使用renderText().

例如,假设您希望页面上的数据框在顶行显示单选按钮:

df <- data.frame(A=1:5,B=1:5)

我们首先需要将df转换为HTML表.这是制作HTML表格单元格和行的函数

cell_html <- function(table_cell) paste0('<td>',table_cell,'</td>')

row_html <- function(table_row) {
  cells <- sapply(table_row,cell_html)
  collapse_cells <- paste0(cells,collapse='')
  paste0('<tr>',collapse_cells,'</tr>')
}

并使用这些功能

df_rows <- apply(df,1,row_html)

现在,这是制作单选按钮的一个愚蠢的小功能

radio_html <- function(radio_name,radio_value,radio_text) {
  paste0('<input type="radio" name="',radio_name,'" value="','">',radio_text)
}

让我们制作与df中的列一样多的单选按钮:

radios <- sapply(seq_along(df),function(x) radio_html(paste0('row',x),x,paste(x)))

这将产生以下形式的HTML:

<input type="radio" name="row1" value="1">1

对于每一行.然后将无线电投射到row_html中以从中创建HTML表格行:

radio_row <- row_html(radios)

现在我们只需要组合df,单选按钮并将整个内容包装在HTML表标签中.

table_cells <- c(radio_row,df_rows)
collapse_cells <- paste0(table_cells,collapse='')
full_table <- paste0('<table>','</table>')

把这整个野兽放在renderText()函数中.我不确定您使用的是ui.R还是您自己的自定义HTML界面.我总是做后者,它给你更多的自由.我会在我的页面上看到这个:

<div name="x" id="x" class="shiny-html-output"></div>

要使我的表输出$x.要设置所选行的样式,我建议使用jQuery.一个简单的事件(高度未经测试)[编辑:见下面评论中建议的修改]:

$('table input:radio').change(function() {

  var index = $('#table input:radio').index(this);

  // Add one to skip radio button row.
  $('table tr').eq(index + 1).css('background-color','blue');

  // Also handle reset on other rows
  // ...
  // ...

});

您也可以尝试将表和“选定”类构建到相应的表行服务器端,并准备好一些CSS样式.

在没有样本数据的情况下,所有这些都未经测试,因此会出现一些错误.

此外,如果您对使用ui.R而不是自己的自定义HTML感到满意,则此方法仍然有效.我只是建议使用自定义HTML,因为你似乎在那条路上徘徊.

我正在回答你的要求……即制作一排领先的单选按钮.我可能不会自己这样做.为什么不使用renderTable()正常生成表格并单独添加单选按钮,即根本不是表格的一部分?请参阅this page of the Shiny tutorial获取帮助.如果你必须将单选按钮与表格列对齐,可以通过一些CSS来实现.

原文链接:https://www.f2er.com/jquery/181371.html

猜你在找的jQuery相关文章