1

我正在尝试创建一个简单的闪亮应用程序，它按顺序提出两个问题。我为每个问题创建了一个 div，隐藏了第二个问题。我正在尝试使用带有操作按钮的 observeEvent 来触发第一个 div 的隐藏和第二个 div 在单击时的显示。但是，单击操作按钮不会触发observeEvent。有什么想法我错过了什么吗？

我的 ui.R 是：

library(shiny)
library(shinyjs)


shinyUI(fluidPage(useShinyjs(),

  # Application title
  titlePanel("My Survey App"),

  # Sidebar with a slider input for number of bins
  sidebarLayout(
    sidebarPanel(

    ),

    # Show a plot of the generated distribution
    mainPanel(
      h2("survey"),
      wellPanel(
          h6('Placeholder for Placeholder for question'),
          br(),
          div(id = 'questionseq1div',
              h5('Text Question Here',align = 'center'),
              br(),br(),
              textInput('sequence-question-1', '', value = "", width = '100%', 
                        placeholder = 'Give a detailed explanation of your position on the question.'),
              br(),br(),
              fluidRow(
                column(6, align="center", offset = 3,
                       actionButton(inputId = 'completedquestion1',label = 'Next '),
                       tags$style(type='text/css', "#button { vertical-align: middle; height: 50px; width: 100%; font-size: 30px;}")
                )
              )
          ),
          shinyjs::hidden(div(id = 'questionseq2div',
                              h5('Slider Input Question Here',align = 'center'),
                              br(),br(),
                              sliderInput('sequence-question-2','Min: 1  Max: 5',min = 1,max = 5,step = 1,ticks = T,value = 3),
                              br(),br(),
                              fluidRow(
                                column(6, align="center", offset = 3,
                                       submitButton('completed-question-2','Submit '),
                                       tags$style(type='text/css', "#button { vertical-align: middle; height: 50px; width: 100%; font-size: 30px;}")
                                )
                              )
          )))
    )
  )
))

我的 server.R 是：

library(shiny)
library(shinyjs)

shinyServer(function(input, output,session) {

  observeEvent(input$completedquestion1,{
    print('Triggered')
    shinyjs::show('questionseq2div')
    shinyjs::hide('questionseq1div')

  })

})
4

2 回答 2

2

我必须重新构建事物以使其工作 - 我没有看到如何在没有问题列表的情况下让它来回切换以进行迭代。一旦那里，然后我添加了一些明显的东西，因为它很有趣......

这里的任何地方都是做你想做的事情的基本结构。

library(shiny)
library(shinyjs)


qlist <- list(
"q1" = list(type="qtext","text"="first text question"), 
"q2" = list(type="qslid","text"="first slider question"), 
"q3" = list(type="qslid","text"="second slider question"), 
"q4" = list(type="qtext","text"="second text question")
)
u <- shinyUI(fluidPage(useShinyjs(),

  # Application title
  titlePanel("My Survey App"),

  sidebarLayout(
    sidebarPanel(  ),

    mainPanel(
       h2("survey"),
       wellPanel( h6(textOutput("curstatus")), 
                  br(),
                  h4(textOutput("curquestion")), 
       div(id = 'questionseq1div',
           h5('div1 - Text Div',align = 'center'), 
           br(),br(),
           textInput('sequence-question-1', '', value = "", width = '100%', 
                     placeholder = 'Give a detailed explanation of your position on the question.'), 
            br(),br()
        ),
        div(id = 'questionseq2div',
               h5('div2 - Slider Div',align = 'center'),
               br(),br(),
               sliderInput('sequence-question-2','Min: 1  Max: 5',min = 1,max = 5,step = 1,ticks = T,value = 3),
               br(),br()
         )
        ),
        div(id='nextbuttondiv',fluidRow(
          column(6, align="center", offset = 3,
                 actionButton(inputId = 'completedquestion',label = 'Next '),
                 tags$style(type='text/css', "#button { vertical-align: middle; height: 50px; width: 100%; font-size: 30px;}")
            )
           )
        )

))))
s <- shinyServer(function(input, output,session) {

       rv <- reactiveValues(qlist=qlist,curqnum=1,inited=FALSE,finished=FALSE)

       setupForCurQuestion <- function(){
         qcur <- rv$qlist[[rv$curqnum]]

         if (qcur$type=="qtext"){
           shinyjs::show('questionseq1div')
           shinyjs::hide('questionseq2div')
         } else {
           shinyjs::hide('questionseq1div')
           shinyjs::show('questionseq2div')
         }
       }

       advanceQuestionAndCheckFinish <- function(){
         if (rv$curqnum==length(rv$qlist)) return(TRUE)
         rv$curqnum <- rv$curqnum+1
         print(rv$curqnum)
         setupForCurQuestion()
         return(FALSE)
       }

       isolate(setupForCurQuestion()) 

       observeEvent(input$completedquestion,{
         if (!rv$finished){
           rv$finished <- advanceQuestionAndCheckFinish()
           if (rv$finished){
             shinyjs::hide('nextbuttondiv')
           }
         }
      })
      output$curquestion <- renderText({
        qcur <- rv$qlist[[rv$curqnum]]
        qcur$text
      })
      output$curstatus <- renderText({
        if (rv$finished) return("Finished")
        sprintf("Question %d of %d",rv$curqnum,length(rv$qlist))
      })
})
shinyApp(u,s)

这是一个屏幕截图： 在此处输入图像描述

于 2017-05-27T10:49:54.907 回答
1

所以，阅读@BigDataScientist 的评论和 Mike 的解决方案，

您有一个隐藏的 submitButton() 并且由于带有 submitButtons() 的应用程序仅在单击该按钮时才更新，并且您隐藏了您处于棘手情况的按钮；) 如果您使用 submitButton() 注释掉该部分，您将看到它有效好吧，... – BigDataScientist

submitButton 和 actionButton 之间的区别以及解决此问题的简单解决方案 -submitButton()与actionButton().

于 2017-05-27T22:14:05.997 回答