r - 如何更新 Shiny 的 fileInput 对象？

Question

我想创建一个输入文件对话框。这很简单，使用 fileInput功能。

shinyUI(pageWithSidebar(
  headerPanel(""),
  sidebarPanel(
    fileInput("file", "Select a file")  
  ),
  mainPanel()
))

上传后是这样的:


现在，我想重置 inputFile元素到它在上传之前的状态。因为没有像 updateFileInput 这样的功能，我是一个 JS/HTML 菜鸟，我无法弄清楚如何实现这一目标。来自 fileInput("file", "Select a file") 的代码输出以下是。

<label>Select a file</label>
<input id="file" type="file" accept="text/plain"/>
<div id="file_progress" class="progress progress-striped active shiny-file-input-progress">
  <div class="bar"></div>
  <label></label>
</div> 

有任何想法吗？

附注。我不想使用响应式(Reactive) renderUI在这里重新渲染文件输入元素。我宁愿走“更新方式”(如果有这样的事情)......

Answer 1

正如@Julien Navarre 指出的，这归结为修改一些 HTML/CSS。 Julien 展示了如何从客户端做到这一点。还有待展示的是如何从服务器端做到这一点。 IE。服务器将调用客户端的一个函数，该函数将设置回输入处理程序。您可以找到一篇关于使用 Shiny 在服务器和客户端之间传递数据的博客文章 here .

在服务器端，关键功能是 session$sendCustomMessage它将调用处理函数 resetFileInputHandler在客户端。文件输入对象的 id 被传递给处理程序。

server.R

shinyServer(function(input, output, session) {

  observe({
    input$btn
    session$sendCustomMessage(type = "resetFileInputHandler", "file1") 
  })

})

现在，在客户端，我们需要注册一个将由服务器调用的处理程序函数，并按照 Julien 的概述执行必要的更改。

ui.R

shinyUI(bootstrapPage(

  fileInput('file1', 'Choose File'),
  actionButton("btn", "Trigger server to reset file input"),

  tags$script('
    Shiny.addCustomMessageHandler("resetFileInputHandler", function(x) {      
        var id = "#" + x + "_progress";      # name of progress bar is file1_progress
        var idBar = id + " .bar";  
        $(id).css("visibility", "hidden");   # change visibility
        $(idBar).css("width", "0%");         # reset bar to 0%
    });
  ')
))

现在按下按钮将使服务器调用 resetFileInputHandler在客户端(当然该按钮仅用于演示目的)。

你可以找到上面的代码 here或者像这样运行它

library(shiny)
runGist("8314905")

注意

此解决方案在方面保持不变:显示在右侧的 Shiny 对象的文件名

<input id="file1" type="file" class="shiny-bound-input">

没有改变。我想这意味着更深入地挖掘它。欢迎提出建议。