用于fileInput和textInput的闪亮并排div [英] Shiny side by side divs for fileInput and textInput

问题描述

以下尝试将Shiny fileInput（）和 textInput（）并排放置。

一个简单的 server.R 文件：

  shinyServer（function（input，output）{}）
  

以下＃基于：< http：//stackoverflow.com/a/21132918/1172302>

＃options（shiny.error = browser）

＃全局变量

display.inline.block< - display：inline-block
class.input.small =input-small
FileInputId< - SampleFile
FileInputLabel< - 示例
TextInputId< - SampleLabel
TextInputLabel< - Label
TextInputLabelDefault< - 示例标签

＃帮助函数

fileInput.custom< - function（inputId，标签，...）
{
tagList（标签$ label（标签，`for` = inputId），
tags $ input（id = inputId，type =file，.. 。）
）
}

textInput.custom< - function（inputId，label，value =，...）
{
tagList（标签$ label（label，`for` = inputId），
tags $ input（id = inputId，type =text，value = value，...）
）
}

filetextInput< - function（fileId，fileLabel，textId，textLabel，textValue，divstyle，...）
{

＃示例文件
div（style = divstyle，
fileInput.custom（inputId = fileId，
label = fileLabel，
class = class.input.small））

＃样本标签，
div（style = divstyle，
textInput.custom（inputId = textId，
label = textLabel，
value = textValue，
class = class.input.small） ）

}

＃闪亮的UI

shinyUI（
fluidPage（

＃示例输入$ b示例$ b div（style = display.inline.block，
fileInput.custom（inputId = FileInputId，
label = FileInputLabel）
），

＃
div（style = display.inline.block，
textInput.custom（inputId = TextInputId，
label = TextInputLabel，
value = TextInputLabelDefault）
），

hr（），

filetextInput（
fileId = FileInputId，
fileLabel = FileInputLabel，
textId = TextInputId，
textLabel = TextInputLabel，
textValue = TextInputLabelDefault，
divstyle = display.inline.block）

）
）


以上结果为：

如截图所示，它使用两个单独的 div s。为什么在 filetextInput（）函数的情况下它不起作用？

解决方案

函数返回最后一个评估值，所以在你的情况下，第一部分会丢失。例如。 ：

  function（）{
a
b
} 
  

返回b

我想要那个。使用div或tagList。

  filetextInput<  -  function（fileId，fileLabel，textId，textLabel，textValue，divstyle，。 ..）
 {
 div（
＃示例文件
 div（style = divstyle，
 fileInput.custom（inputId = fileId，
 label = fileLabel ，
 class = class.input.small）
），
 
＃样本标签，用于绘图
 div（style = divstyle， 
 textInput.custom（inputId = textId，
 label = textLabel，
 value = textValue，
 class = class.input.small）
）
） 
 
} 
  

The following attempts to put Shiny fileInput() and textInput() side by side.

A simple server.R file:

shinyServer(function(input, output) {} )

And the following ui.R:

# Custom function(s) to get file- and text-Input side by side
# Based on: <http://stackoverflow.com/a/21132918/1172302>

# options(shiny.error=browser)

# Globals

display.inline.block <- "display:inline-block"
class.input.small = "input-small"
FileInputId <- "SampleFile"
FileInputLabel <- "Sample"
TextInputId <- "SampleLabel"
TextInputLabel <- "Label"
TextInputLabelDefault <- "Sample Label"

# helper functions

fileInput.custom <- function (inputId, label, ...)
{
    tagList(tags$label(label, `for` = inputId),
            tags$input(id = inputId, type = "file", ...)
    )
}

textInput.custom <- function (inputId, label, value = "",...) 
{
    tagList(tags$label(label, `for` = inputId),
            tags$input(id = inputId, type = "text", value = value,...)
    )
}

filetextInput <- function (fileId, fileLabel, textId, textLabel, textValue, divstyle, ...)
{

    # sample file
    div(style = divstyle,
        fileInput.custom(inputId = fileId,
                      label = fileLabel,
                      class = class.input.small))

    # label for sample, to be used in plot(s)
    div(style = divstyle,
        textInput.custom(inputId = textId,
                      label = textLabel,
                      value = textValue,
                      class = class.input.small))

}

# Shiny UI

shinyUI(
  fluidPage(

    # sample input
    div(style = display.inline.block,
      fileInput.custom(inputId = FileInputId,
                label = FileInputLabel)
    ),

    # label for sample 
    div(style = display.inline.block,
      textInput.custom(inputId = TextInputId,
                label = TextInputLabel,
                value = TextInputLabelDefault)
    ),

    hr(),

    filetextInput(
        fileId = FileInputId,
        fileLabel = FileInputLabel,
        textId = TextInputId,
        textLabel = TextInputLabel,
        textValue = TextInputLabelDefault,
        divstyle = display.inline.block)

  )
)

The above results in:

As shown in the screenshot, it works using two separate divs. Why doesn't it work in the case of the filetextInput() function?

解决方案

Functions return the last evaluated value, so in your case the first part is lost. E.g. :

function(){
"a"
"b"
}

returns "b"

so you don't want that. Use a div or a tagList.

filetextInput <- function (fileId, fileLabel, textId, textLabel, textValue, divstyle, ...)
{
  div(
  # sample file
  div(style = divstyle,
      fileInput.custom(inputId = fileId,
                       label = fileLabel,
                       class = class.input.small)
      ),

  # label for sample, to be used in plot(s)
  div(style = divstyle,
      textInput.custom(inputId = textId,
                       label = textLabel,
                       value = textValue,
                       class = class.input.small)
      )
  )

}

这篇关于用于fileInput和textInput的闪亮并排div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！