Reputation: 581
In R Shiny I wrote the following script as implementation of multiple grouped radio buttons, where the values of the buttons are shown on top, and the radio buttons of multiple questions are aligned to those button values:
library(shiny)
ui <- fluidPage(
titlePanel(title=HTML(" "), windowTitle="Questionaire"),
cellWidths = c("100%"),
cellArgs = list(style = "padding: 6px"),
wellPanel(
splitLayout(cellWidths = c("25%","10%","10%","10%","10%","10%"),"",
p("strongly agree"),p("agree"),p("neutral"),p("disagree"),p("strongly disagree")),
splitLayout(cellWidths = c("25%","10%","10%","10%","10%","10%"),p(strong("The website has a user friendly interface:")),
radioButtons("use1", "", "", selected=0, inline = T),
radioButtons("use2", "", "", selected=0, inline = T),
radioButtons("use3", "", "", selected=0, inline = T),
radioButtons("use4", "", "", selected=0, inline = T),
radioButtons("use5", "", "", selected=0, inline = T)),
splitLayout(cellWidths = c("25%","10%","10%","10%","10%","10%"),p(strong("The website is easy to navigate:")),
radioButtons("nav1", "", "", selected=0, inline = T),
radioButtons("nav2", "", "", selected=0, inline = T),
radioButtons("nav3", "", "", selected=0, inline = T),
radioButtons("nav4", "", "", selected=0, inline = T),
radioButtons("nav5", "", "", selected=0, inline = T))
)
)
server <- function(input, output, session)
{
}
shinyApp(ui = ui, server = server)
In this implementation multiple options per question can be checked. How can the code be changed so that once a user has chosen an option for a question, this choice will be deselected as soon as the user subsequently chooses another option for the same question?
Upvotes: 4
Views: 2687
Reputation: 815
I hope this help you out a little, it may still need some tweaking. I reckon the best way to get a grid is to have one radiobutton option for each 'question'. In order to set this to a grid you may have to play around with the CSS settings in tags$style. For example:
ui <- fluidPage(
tags$style(".checkbox-inline, .radio-inline {
text-align: center;
margin-left: 0px;
margin-right: 0px;
padding: 0px;
width: 20%;} "),
titlePanel(title=HTML(" "), windowTitle="Questionaire"),
cellWidths = c("100%"),
cellArgs = list(style = "padding: 6px"),
wellPanel(
# Introduced div to centre align the headers
splitLayout(cellWidths = c("25%","10%","10%","10%","10%","10%"),"",
div(style="text-align:center", HTML("strongly agree")),
div(style="text-align:center", HTML("agree")),
div(style="text-align:center", HTML("neutral")),
div(style="text-align:center", HTML("disagree")),
div(style="text-align:center", HTML("strongly disagree"))),
splitLayout(cellWidths = c("25%","50%"),
p(strong("The website has a user friendly interface:")),
radioButtons("use1", "", choiceValues=1:5, choiceNames=rep("",5), selected=0, inline = T)
),
splitLayout(cellWidths = c("25%","50%"),
p(strong("The website is easy to navigate:")),
radioButtons("nav1", "", choiceValues=1:5, choiceNames=rep("",5), selected=0, inline = T)
))
)
Upvotes: 3