aligned radio buttons in r Shiny

user_6859020 0
Viewed 2221

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("&nbsp;"), 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?

shiny radio-button r widget radiobuttonlist
1 Answers

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("&nbsp;"), 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)
    ))
  )
user_79203390
Related